鸿蒙的 ArkUI 的变量监听同步

同一文件

@Entry        // 入口
@Component
struct Index {      // 父组件
  @State dd :string = "你好，世界。";    // 变量
  build() {
    Column() {      // 垂直容器
      Text(this.dd)   // 显示文本
        .fontSize(50) // 字体大小
      MainShowDIV({de:$dd})   // 使用子组件 并传入参数 用于双向监听
    }
  }
}

@Component
struct MainShowDIV {    // 子组件
  @Link de :string;     // 监听的子组件变量
  build(){
    Column(){
      Text(this.de)     // 显示文本
        .fontSize(50)
        .fontColor("red")
        .onClick(()=>{    // 点击改变文本
          this.de = "我很好。"
        })
    }
  }
}

不同文件

index.ets

import MainShowDIV from '../../vi-modules/MainShowDIV';

@Entry
@Component
struct Index {      // 父组件
  @State dd :string = "你好，世界。";    // 变量
  build() {
    Column() {      // 垂直容器
      Text(this.dd)   // 显示文本
        .fontSize(50) // 字体大小
      MainShowDIV({de:$dd})   // 使用子组件 并传入参数 用于双向监听
    }
  }
}

MainShowDIV.ets

@Component
export default struct MainShowDIV {    // 子组件
  @Link de :string;     // 监听的子组件变量
  build(){
    Column(){
      Text(this.de)     // 显示文本
        .fontSize(50)
        .fontColor("red")
        .onClick(()=>{    // 点击改变文本
          this.de = "我很好。"
        })
    }
  }
}