微信小程序子组件获取父组件值
时间: 2023-09-25 11:16:06 浏览: 241
微信小程序自定义组件封装及父子间组件传值的方法
在微信小程序中,子组件要获取父组件的值,可以通过两种方式实现:
1. 通过父组件传递属性给子组件:在父组件的 wxml 中,通过属性绑定的方式将值传递给子组件。在子组件的 js 文件中,通过 `this.properties` 可以获取到父组件传递过来的属性值。
例如,在父组件中传递一个名为 `parentValue` 的值给子组件:
```
// 父组件的 wxml
<child-component parentValue="{{parentValue}}"></child-component>
// 子组件的 js
properties: {
parentValue: {
type: String,
value: '',
observer: function(newVal, oldVal) {
console.log(newVal); // 获取到父组件传递的值
}
}
}
```
2. 使用父子组件通信:在微信小程序中,可以使用 `this.selectComponent()` 方法来获取父组件中的子组件实例。通过这个实例,可以调用子组件中的方法或访问子组件中的属性。
例如,在父组件中获取子组件的实例,并调用子组件中的方法:
```
// 父组件的 js
onReady: function() {
const childComponent = this.selectComponent('#childComponent');
childComponent.getChildValue();
}
// 子组件的 js
getChildValue: function() {
console.log('获取子组件的值');
}
```
通过以上两种方式,子组件就可以获取到父组件的值了。希望能够帮助到你!如果有任何问题,请随时提问。
阅读全文