微信小程序子组件调用父组件的方法且传参
时间: 2023-08-10 08:04:29 浏览: 213
微信小程序-登录弹窗授权(组件)
5星 · 资源好评率100%
在微信小程序中,子组件调用父组件的方法并传参可以通过以下步骤实现。首先,在父组件的wxml文件中,给子组件添加一个id属性,例如id="countDown"。然后,在子组件的js文件中,使用this.triggerEvent()方法触发一个自定义事件,并传递参数。例如,在子组件的方法中添加以下代码:
```javascript
closeGold() {
this.triggerEvent('closeGold', {param: '传递的参数'});
}
```
接下来,在父组件的js文件中,使用this.selectComponent()方法获取子组件的实例,然后通过实例调用子组件的方法,并传递参数。例如:
```javascript
let countDown = this.selectComponent('#countDown');
countDown.closeGold();
```
在父组件的wxml文件中,可以通过在子组件标签上添加bind:closeGold事件监听来接收子组件传递的参数。例如:
```html
<count-down id="countDown" bind:closeGold="onCloseGold"></count-down>
```
在父组件的js文件中,定义onCloseGold方法来处理子组件传递的参数。例如:
```javascript
onCloseGold(event) {
console.log(event.detail.param); // 输出传递的参数
}
```
这样,子组件就可以调用父组件的方法并传递参数了。
阅读全文