1.调用组件向自定义组件插入内容,使用 slot
在自定义模板中有一对<view><slot></slot></view>,这里是干什么用的呢?在组件模板中可以提供一个 <slot> 节点,用于承载组件引用时提供的子节点。
在components创建组件 , 点击 components 自动创建好所需文件
在 .wxml 文件中输入
<view>
<slot></slot>
</view>
2 .json 文件 开启 : component: true 开启组件使用
3 如果启用多slot支持 ,在js中引入
options: {
multipleSlots: true // 在组件定义时的选项中启用多slot支持
},
4. 组件完毕, 视图引入组件 , pages 文件中的属于视图
比如:pages文件中的 detail 文件引用组件,为父组件
1. 先在父组件 . json 中 引入 子组件的路径
2. 在 wxml 使用 , 我定义的 子组件 名为 c-ping
如图使用: <c-ping><text> 这里写内容 </text></c-ping>
3. 视图就会显示出来内容,如果没有 slot ,视图就不显示内容
页面显示, OK 了