addAttr
新增元素属性(静态方法),新增后的属性,可以收集变化和 JSON 导出。
关键属性
addAttr ( attrName: string
, defaultValue: IValue
, typeFn?: IAttrDecorator )
新增元素属性(全局操作), defaultValue 为默认值,typeFn 为数据装饰器(默认为 boundsType)。
数据装饰器
数据处理方法,自动为属性生成有相关业务逻辑的 setter/getter 函数。
boundsType
边界类型。
当属性有变化时,会引起元素的重新布局和渲染。
surfaceType
表面类型。
当属性有变化时,会引起元素的重新渲染, 但不会布局。
dataType
数据类型。
当属性有变化时,不会重新布局和渲染。
归属
UI
示例
为文本新增一个 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.1.0', dataType)
// default version
const text = new Text({ text: 'Welcome to LeaferJS' })
leafer.add(text)
console.log((text as any).version) // 1.1.0
// set version
const text2 = new Text({ version: '1.1.0' } as any)
console.log((text2 as any).version) // 1.1.0