开发者社区
社区提问意见反馈
开发者钉组织
扫描二维码
加入支付宝开发者钉组织
开发 > 框架 > 自定义组件 > 创建自定义组件 > 链式注册 api
收藏
订阅更新
我的文档
设置
链式注册 api 是一种新的自定义组件定义形式。
component 支持链式声明
基本用法
javascript
复制代码
component()
.prop('myproperty', '')
.prop('myanotherproperty', '')
.data(() => ({
mydatafield: 'somevalue',
}))
.register()
等价于
json
复制代码
component({
props: {
myproperty: '',
myanotherproperty: '',
},
data: {
mydatafield: 'somevalue',
},
})
说明:链式声明需要以 .register() 结尾,否则视为未完成注册,在此之后配置不可变。在基础库 以后版本可用。
可用性判断
plain text
复制代码
my.caniuse('component.chaining')
示例代码
支持的调用项说明
1prop(key: string, value: any):定义单个属性,等价于 props 定义段中的单个项目。
2data(fn: function)接受一个函数。该函数在组件创建时执行一次,其返回值被用作数据字段。
3externalclasses(classes: string[]):用来定义外部样式类。
4options(opt: object):用于指定组件选项,多次调用时,仅最后一次设置生效。
5methods({ [name: string], fn: function }):用于批量定义组件方法。
6lifetime(name: string, fn: function):注册组件生命周期回调。
7rootevent(name: string, fn: function):注册组件所在页面的生命周期回调。
8observer(key: string | string[], callback: function):定义数据监听器,对于同时监听多个数据的场景,第一个参数需要为数组。
9relation(key: string, value: object):用来定义单个组件间关系项,参考 组件间关系
10mixin(mixinids: string[]):接受链式注册的 mixin().register()。
mixins 支持链式声明
注意:链式注册的组件,仅支持链式注册产生的 mixin 实例。
重复链式调用说明
除了 options 外 ,其他链式调用项都可以重复调用多次,效果将合并。
合并策略说明
配置项
合并策略
prop
默认合并策略,同名属性相互覆盖
methods
默认合并策略,同名属性相互覆盖
relation
默认合并策略,同名属性相互覆盖
options
覆盖,仅最后一次调用有效
data
取函数返回结果,再进行同名属性相互覆盖。
externalclasses
采用数组合并策略
observer
对于相同数据的监听,采用函数合并策略,同名配置合并执行。
说明:对于同时监听多个数据的场景,第一个参数需要为数组。
rootevent
函数合并策略,同名配置合并执行
lifetime
函数合并策略,同名配置合并执行
ref
等同于 .lifetime('ref'),多次调用仅最后一次生效
error
等同于 .lifetime('onerror'),多次调用合并执行
组件 与 mixin 结合、mixin 嵌套时,相互覆盖、合并逻辑:
合并覆盖策略:高优先级覆盖低优先级,组件 > mixin > 子 mixin,靠后的 mixin > 靠前的 mixin。
数组合并策略:合并后的顺序参考 合并覆盖策略,优先级高的靠后
覆盖策略:最终生效的配置参考合并覆盖策略,取优先级高的配置
函数合并策略:对于生命周期、观测器回调,采用合并执行,优先级高的后执行。但若是同一 mixin 被组件多次引用,其生命周期和观测器回调只执行一次。
非连续链式调用说明
链式调用项也可以分开写。
内容没有解决您的问题?您还可以前往 或 寻求帮助
凯发k8官方网娱乐官方 copyright © 2022 支付宝(杭州)信息技术有限公司  | icp证浙b2-20160559
该文档对你是否有帮助?
当前页面目录
网站地图