概述

当我们在鸿蒙开发中需要再父子组件或者兄弟组件之间传值时,可以参考下面的几种方式哦

环境描述

开发环境:Windows 10

DevEco Studio 版本:DevEco Studio 5.0.0 Release(5.0.3.910)

SDK 版本:5.0.0.70(Full SDK)

设备型号:黄鹂

系统版本:OpenHarmony 5.0.0.710  

传值方式:

1.@Prop装饰器:父子单向同步

@Prop装饰的变量可以和父组件建立单向的同步关系。@Prop装饰的变量是可变的,但是变化不会同步回其父组件。

允许装饰的变量类型:Prop 支持类型和State修饰符基本一致,并且Prop可以给初始值,也可以不给

@Prop装饰器不能在 @Entry装饰的自定义组件中使用。

允许本地初始化,也可以不初始化(父组件必须传参)

子组件仍然可以通过修改自己来更新UI,但不会通知父组件(单向),父组件改变后会覆盖子组件自己的值

2.@Link装饰器:父子双向同步

@Prop装饰的变量可以和父组件建立单向的同步关系。

@Prop装饰的变量是可变的,但是变化不会同步回其父组件。

Prop 支持类型和State修饰符基本一致,并且Prop可以给初始值,也可以不给

@Prop装饰器不能在 @Entry装饰的自定义组件中使用。

允许本地初始化,也可以不初始化(父组件必须传参)

子组件仍然可以通过修改自己来更新UI,但不会通知父组件(单向),父组件改变后会覆盖子组件自己的值

3.@Link装饰器:父子双向同步

@Link装饰的变量与其父组件中的数据源共享相同的值。子组件中被@Link装饰的变量与其父组件中对应的数据源建立双向数据绑定。

link支持类型和State修饰符也是基本一致

@Link装饰器禁止本地初始化。

@Link装饰的变量的类型要和数据源类型保持一致,否则框架会抛出运行时错误。

@Link不支持装饰Function类型的变量,框架会抛出运行时错误。

父组件传值时传的必须是Link或者State修饰的数据

4.@Provide装饰器、@Consume:后代组件双向同步(较推荐

 @Provide和@Consume,应用于与后代组件的双向数据同步,应用于状态数据在多个层级之间传递的场景。不同于上文提到的父子组件之间通过命名参数机制传递,@Provide和@Consume摆脱参数传递机制的束缚,实现跨层级传递。

后代通过使用@Consume去获取@Provide提供的变量,建立在@Provide和@Consume之间的双向数据同步。

@Provide装饰变量的初始值必须指定、@Consume装饰变量的初始值禁止本地初始化。

@Provider/@Consumer的参数key必须为string类型,否则编译期会报错。 在不指定Provide名称的情况下,需要使用相同的名字来定义和接收数据。

5.@Observed装饰器和@ObjectLink装饰器:嵌套类对象属性变化

对于多层嵌套的情况,比如二维数组,或者数组项class,或者class的属性是class,他们的第二层的属性变化是无法观察到的。这就引出了@Observed/@ObjectLink装饰器。

@Observed:装饰class。需要放在class的定义前,使用new创建类对象。 @ObjectLink:必须为被@Observed装饰的class实例,必须指定类型。 @ObjectLink不支持简单类型,如果需要使用简单类型,可以使用@Prop。

在子组件中给@ObjectLink装饰的变量赋值是不允许的。

@ObjectLink装饰器不能在@Entry装饰的自定义组件中使用。

@Observed装饰的类,如果其属性为非简单类型,比如class、Object或者数组,也需要被@Observed装饰,否则将观察不到其属性的变化。

@ObjectLink装饰的变量类型需要为显式的被@Observed装饰的类,如果未指定类型,或其不是@Observed装饰的class,编译期会报错。

 

 

Logo

社区规范:仅讨论OpenHarmony相关问题。

更多推荐