HarmonyOS 鸿蒙Next Prop本地初始化不和父组件同步的代码样例在DevEco Studio3.1报错的问题

HarmonyOS 鸿蒙Next Prop本地初始化不和父组件同步的代码样例在DevEco Studio3.1报错的问题 在“@Prop装饰器：父子单向同步”的文档中，介绍“@Prop本地初始化不和父组件同步”时提供的源如下，

@Component
struct MyComponent {
  [@Prop](/user/Prop) customCounter: number;
  [@Prop](/user/Prop) customCounter2: number = 5;

  build() {
    Column() {
      Row() {
        Text(`From Main: ${this.customCounter}`).width(90).height(40).fontColor('#FF0010')
      }

      Row() {
        Button('Click to change locally !').width(180).height(60).margin({ top: 10 })
          .onClick(() => {
            this.customCounter2++
          })
      }.height(100).width(180)

      Row() {
        Text(`Custom Local: ${this.customCounter2}`).width(90).height(40).fontColor('#FF0010')
      }
    }
  }
}

@Entry
@Component
struct MainProgram {
  @State mainCounter: number = 10;

  build() {
    Column() {
      Row() {
        Column() {
          Button('Click to change number').width(480).height(60).margin({ top: 10, bottom: 10 })
            .onClick(() => {
              this.mainCounter++
            })
        }
      }

      Row() {
        Column()
        // customCounter必须从父组件初始化，因为MyComponent的customCounter成员变量缺少本地初始化；此处，customCounter2可以不做初始化。
        MyComponent({ customCounter: this.mainCounter })
        // customCounter2也可以从父组件初始化，父组件初始化的值会覆盖子组件customCounter2的本地初始化的值
        MyComponent({ customCounter: this.mainCounter, customCounter2: this.mainCounter })
      }
    }
  }
}

运行没有问题，但是始终提示，

Variables decorated by ‘@Prop’, ‘@Link’, ‘@Consume’, and ‘@ObjectLink’ cannot be initialized locally. <etsLint>

我的理解是代码没有问题，但是IDE报错，提示有误。大家有遇到同样的问题吗？


更多关于HarmonyOS 鸿蒙Next Prop本地初始化不和父组件同步的代码样例在DevEco Studio3.1报错的问题的实战教程也可以访问 https://www.itying.com/category-93-b0.html

3 回复

我感觉是文档,跟IDE没有同步, 不过我也是需要这个默认值的,啥时候才能更新这个问题啊

更多关于HarmonyOS 鸿蒙Next Prop本地初始化不和父组件同步的代码样例在DevEco Studio3.1报错的问题的实战系列教程也可以访问 https://www.itying.com/category-93-b0.html


+1，我看文档也说的是@Prop可以本地初始化，但是编辑器也是报同样的错误。

在HarmonyOS中，如果鸿蒙Next Prop本地初始化不与父组件同步，可能会导致在DevEco Studio 3.1中报错。以下是一个可能导致报错的代码样例：

@Entry
@Component
struct ParentComponent {
  @State message: string = 'Hello, Parent!'

  build() {
    Column() {
      Text(this.message)
        .fontSize(30)
        .margin(20)
      ChildComponent({ message: this.message })
    }
  }
}

@Component
struct ChildComponent {
  @Prop message: string = 'Hello, Child!'

  build() {
    Column() {
      Text(this.message)
        .fontSize(20)
        .margin(10)
    }
  }
}

在这个样例中，ChildComponent的@Prop属性message被初始化为'Hello, Child!'，而父组件ParentComponent传递的message是'Hello, Parent!'。由于@Prop属性在本地初始化后不会与父组件同步，这可能导致DevEco Studio 3.1报错。

要解决这个问题，应确保@Prop属性不在本地初始化，而是完全依赖于父组件传递的值。修改后的代码如下：

@Entry
@Component
struct ParentComponent {
  @State message: string = 'Hello, Parent!'

  build() {
    Column() {
      Text(this.message)
        .fontSize(30)
        .margin(20)
      ChildComponent({ message: this.message })
    }
  }
}

@Component
struct ChildComponent {
  @Prop message: string

  build() {
    Column() {
      Text(this.message)
        .fontSize(20)
        .margin(10)
    }
  }
}

这样，ChildComponent的message属性将完全依赖于父组件传递的值，避免了因本地初始化导致的同步问题。

回到顶部