五、【鸿蒙 NEXT】如何抽取公共样式

前言：
开发过程中我们经常会遇到同一类型的组件样式都是一样的，如果每个组件都复制一份样式，代码会产生冗余，并且如果要改动这个样式，由于代码太分散，很容易改漏。那么纯血鸿蒙中如何抽取公共样式呢。主要分为两种
（1）单个ets文件的样式抽取，这种方式抽取的样式只能在当前ets文件中共享。其他ets文件无法引用。
（2）跨ets文件的公共样式抽取。

一、单ets文件公共样式抽取
1、使用@Styles装饰器，该装饰器只能抽取组件的通用属性及通用事件，比如height，width这些属于所有组件都有的属性，叫做通用属性

这里有两种写法，一个是全局定义的需要加function关键字，如果定义在类里面，不需要加function

编辑

2、使用@Extend装饰器，如果想要抽取比如Text组件的私有属性，比如maxLines设置文本的最大行数等。则可以使用@Extend装饰器。

使用方式如下，其中@Extend接收一个组件类型作为参数，如果传入的是Text组件，则只能被Text组件引用。

编辑

二、跨文件公共样式的抽取
上文中的方式只能在单个文件中引用，无法把这些样式给export出去。那么如果想要把样式export出去，则需要使用AttributeModifier类。

使用方式如下，需要继承AttributeModifier类，且接收一个泛型类xxxAttribute的属性类，表示你需要扩展的哪种类型的组件。然后实现applyNormalAttribute方法，该方法中可以使用if/else判断

定义公共样式：

编辑

 引用公共样式：

编辑

**上面展示的是特定组件的公共样式抽取， 如果你想抽取组件的通用属性，给不同组件都能引用，可以使用CommonMethond

抽取通用属性公共类：**

编辑

 在页面中实例化Column和Text组件的样式类，分别引用

编辑

---

【原创声明】

本文为本人原创文章，首次发表于【51CTO作者zhujian8263 】，原文链接：[五、【鸿蒙 NEXT】如何抽取公共样式_11956021的技术博客_51CTO博客]。