Skip to content

addAttr

新增元素属性(静态方法),新增后的属性,可以收集变化和 JSON 导出。

关键属性

addAttr ( attrName: string, defaultValue: IValue, typeFn?: IAttrDecorator )

新增元素属性(全局操作), defaultValue 为默认值,typeFn 为数据装饰器(默认为 boundsType)。

数据装饰器

数据处理方法,自动为属性生成有相关业务逻辑的 setter/getter 函数。

boundsType

边界类型。

当属性有变化时,会引起元素的重新布局和渲染。

surfaceType

表面类型。

当属性有变化时,会引起元素的重新渲染, 但不会布局。

dataType

数据类型。

当属性有变化时,不会重新布局和渲染。

示例

为文本新增一个 float 属性

ts
import { Leafer, Text } from 'leafer-ui'

const leafer = new Leafer({ view: window })

Text.addAttr('float', 'left')  

// default float

const text = new Text({ text: 'Welcome to LeaferJS' })

leafer.add(text)

console.log((text as any).float) // left

// set float

const text2 = new Text({ float: 'right' } as any)

console.log((text2 as any).float) // right

为文本新增一个 dataType 类型的属性

ts
import { Leafer, Text, dataType } from 'leafer-ui'

const leafer = new Leafer({ view: window })

Text.addAttr('version', '1.0.0', dataType)  

// default version

const text = new Text({ text: 'Welcome to LeaferJS' })

leafer.add(text)

console.log((text as any).version) // 1.0.0

// set version

const text2 = new Text({ version: '1.1.0' } as any)

console.log((text2 as any).version) // 1.1.0

Released under the MIT License.