微信小程序|微信小程序 Mixin混入 的实现
【微信小程序|微信小程序 Mixin混入 的实现】之前开发用的比较熟悉的是vue，在vue中有一个混入的功能，可以比较灵活的复用一些组件内的功能，最近在开发小程序，也遇到了类似的情景，于是在网上查了资料，自己整理了一份用于页面间的混入，具体混入规则与vue相似
// 原生属性及方法
const originProperties = ['data', 'properties', 'options']
const originMethods = [
'onLoad',
'onShow',
'onReady',
'onHide',
'onUnload',
'onPullDownRefresh',
'onReachBottom',
'onShareAppMessage',
'onPageScroll',
'onResize',
'onTabItemTap'
]// merge方法
function mergeMixin (mixins, options) {
mixins.forEach(mixin => {
// 检查 mixin 数据类型
if(Object.prototype.toString.call(mixin) !== '[object Object]') {
throw new Error('mixin is not object')
}
for (const [key, value] of Objbect.entires(mixin)) {
if (originProperties.includes[key]) {
// 混入属性
options[key] = {...value, ...options[key]}
} else if (originMethods.includes[key]) {
// 混入方法
const originFunc = options[key]
options[key] = function(...arg) {
value.call(this, ...arg)
originFunc && originFunc.call(this, ...arg)
}
} else {
// 混入其他自定义方法
options = { ...mixin, ...options }
}
}
});
return options
}export default function (options = {}) {
if (Array.isArray(options.mixins)) {
options = mergeMixin(options.mixins, options)
}
delete options.mixins
return Page(
...options
)
}
推荐阅读
- 一个小故事，我的思考。
- 家乡的那条小河
- 一个人的碎碎念
- 野营记-第五章|野营记-第五章 讨伐梦魇兽
- 昨夜小楼听风
- 2021-02-17|2021-02-17 小儿按摩膻中穴-舒缓咳嗽
- 基于微信小程序带后端ssm接口小区物业管理平台设计
- 2019.4.18感恩日记
- 那件我们忽略的小事叫感恩
- 你有婚内虐待行为吗（）