HarmonyOS 鸿蒙Next：我想实现hello 张三点击后变成hello 李四，但是为什么初始界面不是hello 张三？

HarmonyOS 鸿蒙Next：我想实现hello 张三点击后变成hello 李四，但是为什么初始界面不是hello 张三？

我只要把Text('hello ${this.name}')改成Text(this.name)就可以运行文件，但是我不知道如何在加上hello后显示hello 张三？

@Entry
//加了这个组件就变成了app的入口
@Component
//自定义组件，装饰到组件上面
struct Index {
  @State name: string = '张三' //定义了一个名字是message的变量，@state表示这个是一个状态变量，状态变量所对应的组件改变，会使得ui更新

  build() { //表示以声明式的方式来描述一个ui结构
    Column() {
      Text('hello ${this.name}')//展示状态变量的值
        .fontSize(50)//设置文本大小
        .fontWeight(FontWeight.Bold) //设置字体为粗体
      Divider() //分隔组件
      Button('点击')//按钮中有一个点击
        .onClick(() => { //使用一个箭头函数
          this.name = '李四' //当点击的时候，personname就变成李四
        })
        .height(50)
        .width(100)
        .margin({ top: 50 }) //边框
    }
  }
}

更多关于HarmonyOS 鸿蒙Next：我想实现hello 张三点击后变成hello 李四，但是为什么初始界面不是hello 张三？的实战教程也可以访问 https://www.itying.com/category-93-b0.html

10 回复

用模板字符串

@Entry
@Component
struct Page011 {
  @State name: string = '张三'

  build() {
    Column() {
      Text(`hello ${this.name}`)
        .fontSize(50)
        .fontWeight(FontWeight.Bold)
      Divider()
      Button('点击')
        .onClick(() => {
          this.name = '李四'
        })
        .height(50)
        .width(100)
        .margin({ top: 50 })
    }
  }
}

更多关于HarmonyOS 鸿蒙Next：我想实现hello 张三点击后变成hello 李四，但是为什么初始界面不是hello 张三？的实战系列教程也可以访问 https://www.itying.com/category-93-b0.html


感谢，谢谢楼主，

反引号不好输入，可以直接

Text("hello"+this.name)

感谢，谢谢楼主，

模板字符串引号是斜的   ,单击波浪键~

Text('hello ${this.name}')模板字符串不是单引号，而是反引号键盘1边上的反引号``。

感谢，谢谢楼主，

您好，占位符会生成一个新的字符串，默认不是状态变量，改成Text(this.name)后，再点击按钮时改为this.name += '李四'，试试

感谢，谢谢楼主，

针对你提到的HarmonyOS鸿蒙Next系统中，实现点击后文本从“hello 张三”变为“hello 李四”，但初始界面未显示“hello 张三”的问题，这里可能的原因及解决思路如下：

  1. 数据绑定问题：检查你的界面元素是否已正确绑定到数据源。在鸿蒙系统中，通常使用数据绑定机制来动态更新界面。如果数据源初始值未正确设置或绑定，界面将不会显示预期内容。

  2. 界面元素初始化：确认界面元素（如Text组件）在布局文件中已正确初始化，并设置了初始显示的文本内容。如果初始化时未设置文本，界面将不会显示任何内容。

  3. 生命周期问题：检查应用或页面的生命周期管理。有时，由于页面加载顺序或条件判断，导致某些界面元素在初始化时未能正确渲染。

  4. 代码逻辑错误：仔细检查与文本更新相关的代码逻辑，确保在点击事件触发前，界面已正确显示初始文本。

如果以上检查均无误，但问题依旧存在，可能是系统或框架层面的bug。此时，建议直接联系鸿蒙系统的官方客服以获取进一步的支持。官网客服地址：官网客服地址

回到顶部