如何改变组件的background？

Question

如何改变组件的background

尝试以下方法，未能改变

一：

@State testBackgroundColor: ResourceColor = Color.Red

@Builder
testBackground() {
  Ellipse({width: "100%"， height: "100%"})
    .fill(this.testBackgroundColor)
}

Text()
  .width(20)
  .height(10)
  .onClick(() => {this.testBackgroundColor = Color.Blue})
  .background(this.testBackground)
//.background(this.testBackground())

二：

@State testBackgroundColor: ResourceColor = Color.Red

@Builder
testBackground(value: ResourceColor) {
  Ellipse({width: "100%"， height: "100%"})
    .fill(value)
}

Text()
  .width(20)
  .height(10)
  .onClick(() => {this.testBackgroundColor = Color.Blue})
  .background(this.testBackground(this.testBackgroundColor))

点击Text后未能显示蓝色。

Answer 1

解决方案：

自定义背景渲染会有一定延迟，不能响应事件，不能进行动态更新。该属性不支持嵌套使用，不支持预览器预览。

规格文档说明了自定义背景无法动态更新

https://developer.huawei.com/consumer/cn/doc/harmonyos-references/ts-universal-attributes-background-0000001821000793\#ZH-CN\_TOPIC\_0000001821000793\_\_background10