如何使用 Piece 组件实现带有点击效果的按钮？

Question

我用 Piece 组件想做一个自定义的按钮，当用户点击时背景颜色会变化。可是一直没能实现理想的点击效果，尤其是动态改变背景颜色的部分。有朋友知道怎么实现吗？最好有个简单的代码可以参考一下。

本文参与了 【 HarmonyOS NEXT 技术问答冲榜，等你来战！】欢迎正在阅读的你也加入。

Answer 1

可以使用 Piece 组件，并为其添加 onClick 事件来动态改变背景颜色。

export default {
  data: {
    backgroundColor: "#f0f0f0"
  },
  onClick() {
    this.backgroundColor = "#00ff00"; // 修改为点击后的颜色
  }
}

<Piece style="background-color: {{backgroundColor}}" onClick="onClick">
  <Text>点击我改变颜色</Text>
</Piece>

本文参与了 【 HarmonyOS NEXT 技术问答冲榜，等你来战！】欢迎正在阅读的你也加入。