@State修饰符
tips:并不是说所有@State修饰的变量修改都会引起UI刷新,只有被框架观察到的才能引起刷新 当变量是基本类型时,如string、number、boolean等,这些变量的修改能够刷新UI;而当变量是class、object时,框架只能观察到第一层属性赋值的变化,即Object.keys(observedObject)返回的属性
@State person: Person = {
name: ‘jack’,
dog {
name: ‘柯基’
}
}
如果直接修改name和dog能够刷新,但是修改dog里面的name不会引起刷新
@Prop修饰符
可变的,且父子单向传递(即父组件的修改能影响到子组件,但是子组件的修改不会同步到父组件)
@Link修饰符
可变的,且父子双向传递(即父组件的修改能影响到子组件,且子组件的修改可以同步到父组件)
@Provide @Consume
可以将变量数据传递给后代组件,同时能进行双向同步 使用步骤:
1、将父组件的状态属性使用@Provide修饰
2、子组件通过@Consume修饰
@Observed & @ObjectLink
前面所说的@State、@Prop、@Link等当遇到嵌套对象数组时,只能观察到第一层属性的变化,而第二层等属性变化是不会引起刷新的,所以引出@Observed & @ObjectLink装饰器来解决这个问题,能够进行双向数据同步
tips:@ObjectLink不能用于@Entry装饰的组件中 @Observed只能修饰class
@Observed class Person { id: number name: string age: number
constructor(obj: IPerson) { this.id = obj.id this.name = obj.name this.age = obj.age } }