微信小程序父组件获取子组件的点击事件——子组件给父组件传值
程序员文章站
2024-03-15 11:04:53
...
以下为举例:
//子组件的wxml:
<view class="work_list">
<block wx:for="{{workList}}" wx:key="index">
<view class="work_li" bindtap='showWork' data-id="{{item.Id}}">
这是一个例子!!!
</view>
</block>
</view>
子组件wxml中绑定了showWork事件,在js中调用方法如下:
Component({
properties: {//父级组件传来的参数
workList: {
type: Array,
value: []
},
},
data: {
work_tabindex: 0, //当前tab序号
},
methods: {
showWork(e){//点击弹出作品弹窗
this.triggerEvent('showWork',e.currentTarget.dataset.id)
}
}
})
父组件首先在wxml里接收triggerEvent里面传来的showWork,然后调用事件,方法如下:
//父组件的wxml
<List workList="{{work_list}}" bind:showWork="show_work"></List>
然后,父组件要在js里面执行show_work:
show_work(e) {
console.log(e.detail);//这里输出的值对应子组件传来的id
},
上一篇: Java web 项目之间的相互调用