微信小程序 - slot 插槽 - 20

最新推荐文章于 2024-08-20 11:07:21 发布

前端施工员

最新推荐文章于 2024-08-20 11:07:21 发布

阅读量247

点赞数

分类专栏：微信小程序原生开发文章标签：前端 javascript 微信小程序

本文链接：https://blog.csdn.net/qq_25906119/article/details/128695807

版权

本文介绍了微信小程序中插槽的使用，包括默认插槽和具名插槽的概念。默认插槽允许父组件的内容在子组件内显示，而具名插槽则适用于多内容插槽的场景，需要在子组件JS文件中配置options，并通过slot属性指定内容位置。

摘要由CSDN通过智能技术生成

父组件使用子组件的时候，在子组件其中加入某一段代码结构，子组件使用 <slot></slot> 将其内容全部默认展示，这就是最基本的插槽使用

父组件：

<topHeader>
  <view>我是父组件123</view>
  <view>我是父组件456</view>
  <view>我是父组件789</view>
</topHeader>

子组件：

<slot></slot>

如果使用单内容且默认显示的话可以使用默认插槽，但是如果多插槽内容且需要配置插槽位置使用具名插槽，微信小程序的开发与Vue的使用有所区别，若要使用具名插槽，还需要在子组件的 js 文件中配置 options

Component({
  options:{
    multipleSlots:true
  },
  properties: {},
  data: {},
  methods: {}
})

父组件：

对不同的内容打上标记，slot="

最低0.47元/天解锁文章

关注

专栏目录