作用

与@State作用相同，都是用来驱动视图重新渲染的，只不过@Prop和@Link是用来在父子组件之间传递数据时驱动视图更新的。描述起来比较绕口，看看下面的示例代码就明白了：

页面的示例代码

@Entry
@Component
struct Index {
  @State age: number = 0
  build() {
    Column() {
      // 自定义组件
      MyText({age: this.age})
    }
  }
}

上面的代码中，第8行封装了一个自定义组件，这个自定义组件就被称为子组件，而承载它的这个页面就称为父组件。

要在Index页面和MyText组件中共享age数据，并且age数据发生变更时让MyText重新渲染就要在子组件中使用@Prop装饰器修饰相关变量。

代码如下：

子组件MyText的示例代码

@Component
struct MyText {
  @Prop age: number

  build() {
    Text(this.age.toString())
      .onClick(() => {
        this.age++
      })
  }
}

@Link

作用

上文中提到的@Prop的功能，@Link都具备

不同点

不同的地方在于: 用@Prop修饰的变量传值的时候是值传递，而@Link修饰的变量传值的时候是引用传递。

通俗的讲值传递就是传值的时候把变量的数据拷贝一份传递过去，传递过去的值无论怎么变化都不会影响到原本的值，因为它们在内存中指向的是完全不同的地址。

而引用传递传递的是这个变量在内存中的地址，在父组件中修改这个变量的内容，子组件可以感知到新内容，反之亦然。

举个生活中的栗子来说明

假如A需要B和他一起对一份word文档进行编辑，这时A把这篇文档拷贝一份发给B，不论B对这份文档删除内容也好，新增内容也好。都不会影响到A这边正在编辑的文档。这个就是@Prop

但是如果他们使用了在线文档协同编辑（类比微信群中的文档小助手），那么A对这份文档的增删改B都可以看到，B对这份文档的增删改A也都可以看到。因为他们编辑的都是在线服务中的同一篇文档。这个就是@Link