uniappp怎么使用父组件watch监听子组件参数
时间: 2023-09-22 22:08:09 浏览: 120
详解vue2父组件传递props异步数据到子组件的问题
要使用父组件的 `watch` 监听子组件参数,需要先将子组件的参数通过 `$emit` 发送到父组件,然后在父组件中使用 `watch` 监听该参数的变化。
具体实现步骤如下:
1. 在子组件中,定义一个方法用于发送参数到父组件:
```javascript
this.$emit('changeParam', paramValue);
```
其中,`changeParam` 是一个自定义事件名,`paramValue` 是要发送的参数值。
2. 在父组件中,使用 `watch` 监听子组件发送的参数:
```javascript
watch: {
childParam: function(newVal, oldVal) {
// 参数变化后的处理逻辑
}
}
```
其中,`childParam` 是要监听的子组件参数。
3. 在父组件中,定义一个方法用于接收子组件发送的参数,将其赋值给 `childParam`:
```javascript
methods: {
onChangeParam: function(paramValue) {
this.childParam = paramValue;
}
}
```
4. 在父组件中,使用 `v-on` 监听子组件发送的事件,并调用相应的方法:
```html
<child-component v-on:changeParam="onChangeParam"></child-component>
```
其中,`child-component` 是子组件的标签名,`onChangeParam` 是父组件的方法名。
这样,当子组件的参数发生变化时,就会触发父组件的 `watch` 监听函数,从而实现了父组件监听子组件参数的功能。
阅读全文