如果多个组件的样式是一样的，如何快速定义复用样式？

HarmonyOS

2024-07-11 11:11:45

浏览

回答 2

待解决

回答 2

按赞同

按时间

可以使用@Styles用于样式的扩展，在@Styles的基础上，鸿蒙还提供了@Extend，用于扩展原生组件样式。

但@Styles仅支持通用属性和通用事件。

和@Styles不同，@Extend支持封装指定组件的私有属性、私有事件和自身定义的全局方法。

2024-07-11 16:57:42

例如：Text1和Text2的width，height，margin都一样

Text("Text1")
  .width(100)
  .height(150)
  .margin(20)

Text("Text2")
  .width(100)
  .height(150)
  .margin(20)

使用@Styles注解后，只需要封装textStyle方法，Text组件只需调用textStyle方法即可实现相同的效果。

@Styles
function textStyle() {
  .width(100)
  .height(150)
  .margin(20)
}


Text("Text1")
  .textStyle()
Text("Text2")
  .textStyle()

2024-07-12 10:03:26

发布