diff --git a/packages/common/helper.js b/packages/common/helper.js index 4848f7b0..a1aa1b1b 100644 --- a/packages/common/helper.js +++ b/packages/common/helper.js @@ -5,56 +5,72 @@ function extractComponentId(event = {}) { return componentId; } -const LIFE_CYCLE = ['onLoad', 'onReady', 'onShow', 'onHide', 'onUnload', 'onPullDownRefresh', 'onReachBottom', 'onShareAppMessage', 'onPageScroll']; /* - 1. 直接合并所有生命周期函数 + 注:默认合并所有生命周期函数 + 配置合并指定的生命周期 or 忽略指定字段 + const extend = extendCreator({ + life: ['onLoad', 'onPullDownRefresh'], + exclude: ['binder'] + }); + Page(extend({}, { onLoad() {}, ... })); - - 2. 只合并指定的生命周期 - const extendOnload = extend(['onLoad']); - Page(extendOnload({}, { - onLoad() {}, - ... - })); */ -const extend = (obj, ...rest) => { - if (Array.isArray(obj)) { - let lifeCycleList = obj.filter(item => LIFE_CYCLE.indexOf(item) >= 0); - return extendWithLife.bind(null, lifeCycleList); - } - return extendWithLife(LIFE_CYCLE, obj, ...rest); + +const LIFE_CYCLE = ['onLoad', 'onReady', 'onShow', 'onHide', 'onUnload', 'onPullDownRefresh', 'onReachBottom', 'onShareAppMessage', 'onPageScroll']; + +const extendCreator = (config = {}) => { + const { + life = LIFE_CYCLE, + exclude = [] + } = config; + + const excludeList = exclude.concat(LIFE_CYCLE.map(getFuncArrayName)); + + if (!Array.isArray(life) || !Array.isArray(exclude)) throw new Error('Invalid Extend Config'); + let lifeCycleList = life.filter(item => LIFE_CYCLE.indexOf(item) >= 0); + return function extend(target, ...objList) { + objList.forEach((source) => { + if (source) { + let keys = Object.keys(source); + keys.forEach((key) => { + let value = source[key]; + if (excludeList.indexOf(key) >= 0) return; + if (lifeCycleList.indexOf(key) >= 0 && typeof value === 'function') { + let funcArrayName = getFuncArrayName(key); + if (!target[funcArrayName]) { + target[funcArrayName] = []; + if (target[key]) { + target[funcArrayName].push(target[key]); + } + target[key] = function (...rest) { + target[funcArrayName].forEach(func => func.apply(this, rest)); + }; + } + + if (source[funcArrayName]) { + // 经过生命周期合并的组件直接整合函数列表 + target[funcArrayName].push(...source[funcArrayName]); + } else { + // 添加生命周期函数进入函数列表 + target[funcArrayName].push(value); + } + } else { + target[key] = value; + } + }); + } + }); + return target; + }; }; -const extendWithLife = (lifeCycleList, target, ...objList) => { - objList.forEach((source) => { - if (source) { - let keys = Object.keys(source); - keys.forEach((key) => { - let value = source[key]; - if (lifeCycleList.indexOf(key) >= 0 && typeof value === 'function') { - // 合并生命周期函数,可选择改成闭包函数列表 - let funcArrayName = `__$${key}`; - if (!target[funcArrayName]) { - target[funcArrayName] = [value]; - target[key] = function(...rest) { - target[funcArrayName].forEach(func => func.apply(this, rest)); - }; - } else { - target[funcArrayName].push(value); - } - } else { - target[key] = value; - } - }); - } - }); - return target; -}; +const getFuncArrayName = name => `__$${name}`; module.exports = { extractComponentId, - extend + extend: Object.assign, + extendCreator }; diff --git a/packages/tab/README.md b/packages/tab/README.md index f6fdaa55..9131b2e3 100644 --- a/packages/tab/README.md +++ b/packages/tab/README.md @@ -22,18 +22,20 @@ Page(extend({}, Tab, { ### 代码演示 在模板中使用 zan-tab 模板,并传入相应数据 ```html - + ``` | 参数 | 说明 | 类型 | 默认值 | 必须 | |-----------|-----------|-----------|-------------|-------------| -| list | tab 列表 | Array | - | | -| selectedId | 当前被选中 tab 项的 id | String | - | | -| scroll | 是否开启 tab 左右滑动模式 | Boolean | - | | +| tab | tab 配置对象 | Object | - | | +| tab.scroll | 是否开启 tab 左右滑动模式 | Boolean | - | | +| tab.list | 可选项列表 | Array | - | | +| tab.selectedId | 选中id | - | - | | +| tab.height | tab高度 | Number | - | | | componentId | 用于区分页面多个 tab 组件 | String | - | | -tab 组件中,list 数据格式如下 +tab 组件中,tab.list 数据格式如下 ```js [{ // tab 项 id