问题:开发过程中,难免会用到自创组件,之后想父组件把值传入自创的组件(子组件),如果传的值是发起请求去获取到的,那么问题可能会发生,子组件里想要在ready里拿到的值为空或者是properties下接受属性的默认值value
例子:
Component({
properties: {
Obj: {
type: Object,
value: {}
}
},
ready() {
console.log(this.properties) // 打印为{ Obj:{...} } 是有值的
console.log(this.properties.Obj) // 打印为{} 是空对象
}
})
场景:因为传入的Obj是API获取的,此时数据还没给到properties下定义的Obj,只是在组件的properties缓冲区中,之后再会渲染到子组件的属性下。
解决方法:给该属性进行监听
Component({
properties: {
Obj: {
type: Object,
value: {},
observer: function (newVal) {
console.log(newVal) // 这里可以发现 第一次值是空 第二次才有值。说明进行了值变化的操作。验证了刚才的场景说法。
// 在这里进行对值的处理,直接渲染在页面上
}
}
},
ready() {
console.log(this.properties) // 打印为{ Obj:{...} } 是有值的
console.log(this.properties.Obj) // 打印为{} 是空对象
}
})