首页 > 微信应用  > 

浅析小程序中的插槽、父子组件通讯的几种方式

浅析小程序中的插槽、父子组件通讯的几种方式
本篇文章给大家介绍一下微信小程序中的插槽、父子组件通讯的几种方式,希望对大家有所帮助!

本篇文章给大家介绍一下微信小程序中的插槽、父子组件通讯的几种方式,希望对大家有所帮助!

今天我们一起看一下小程序中的插槽和父子组件相互通讯方面的内容,来看一下和vue有什么样的区别?【相关学习推荐:小程序开发教程】

一、插槽

1. 什么是插槽?

在自定义组件的 wxml 结构中,可以提供一个 节点(插槽),用于承载组件使用者提供的 wxml 结构

其实插槽, 说的通俗一些, 就是 子组件挖坑,父组件填坑 的过程。由父组件在使用子组件的时候, 决定子组件内部的某一些布局展示

子组件通过挖坑

父组件通过组件标签中间的内容来填坑

2. 单个插槽

在小程序中,默认每个自定义组件中只允许使用一个  slot 占位,这种个数上的限制叫做单个插槽

默认情况下,一个组件的 wxml 中只能有一个 slot

需要使用多 slot 时,可以在组件 js 中声明启用

注意:小程序中目前只有默认插槽和多个插槽,暂不支持作用域插槽

代码如下(示例):

<!-- 组件的封装者 --><view class="wrapper"> <view>这里是组件的内部节点</view> <!-- 对于不确定的内容,可以使用<slot>进行占位,具体的内容由组件的使用者决定 --> <slot></slot></view><!-- 组件的使用者 --><component-tag-name> <!-- 这部分内容将被放置在组件<slot>的位置上 --> <view>这里是插入到组件slot的内容</view></component-tag-name>

浅析小程序中的插槽、父子组件通讯的几种方式由讯客互联微信应用栏目发布,感谢您对讯客互联的认可,以及对我们原创作品以及文章的青睐,非常欢迎各位朋友分享到个人网站或者朋友圈,但转载请说明文章出处“浅析小程序中的插槽、父子组件通讯的几种方式