微信小程序自定义组件子传父详解
前言:
刚开始为了测试父传子,所以把页面的数组放在了父组件中
1.然而子组件中绑定的自定义点击事件依然放在子组件的js文件中
2.所以就会出现我们点击页面的文字能改变其样式却不能改变父组件的数据,因为子组件本身只能修改自己的数据,子组件修改了自己的数据后只能把新值传递到自身data{}里面,父组件数据并不受影响
3.此时为了能使父元素中的数据改变,我们必须让子组件向父组件传递数据,我们希望被点击的isactive属性变化,故我们只需要获取点击的元素索引即可
我们先获取到了当前点击到的元素的索引,再通过triggerEvent(“父组件自定义事件的名称”,父组件希望获取的参数)在子组件中触发自身点击事件的时候触发父组件自定义事件
4.我们在父组件的自定义事件中这样写:
父组件先拿到子组件传递上来的索引,再获取数组,再遍历数字,若遍历的数组的索引与传过来的索引一致,则修改样式,最后将变化了的数据传递到自身data{}中,此时子传父完成
此时父组件的数据已经可以根据子组件的点击事件而改变