第一步 在pages同级的地方创建一个新的components文件夹 里面放置所有的子组件
第二步 鼠标右键新建文件夹 名字自己根据自己的需求去取 创建完文件夹之后鼠标右键新建的文件夹 点击新建component 名字跟文件夹的名字保持一致
这样一个子组件就创建好了
第三步
哪个文件需要使用子组件就在哪个文件的 .jaon文件里
在子组件写上组件1 方便展示
在父组件 使用 还是把子组件的名称作为标签使用
我们看效果
已经创建成功 可以使用
组件创建之后开始使用组件 下面给大家演示一下 我建了三个子组件 分别是
myInput 组建一 myList 组件二 myNum 组件三
index是父组件
首先说一下 子传父 我们都知道当使用子组件的时候 大多数据操作都在父组件里进行
把相应的子组件放到父组件中
在子组件绑定我们需要的事件 我绑定的是失焦事件
在myInput子组件的js文件内 通过 triggerEvent('要传递的事件名',要传的值) 方法 把子组件的事件传递给父组件
在父组件中的子组件标签上接收传递过来的事件
在父组件中的js文件里进行逻辑操作
刚好我们把数据添加之后要在myList这个组件展示 所有就开始我们组件之间的传值的 父传子
因为我们myList组件要进行数据展示 但是数据在父组件里 所以我们就要把数据从父组件传到子组件
粉色框框里是我标注的是父组件要传递的数据
在myList子组件里的.js文件里接收父组件传递过来的数据
在myList子组件的.wxml 里遍历 接收的lists数据
又看不懂的小伙伴 欢迎下方给钢铁侠留言哦