构建小程序的Minx 和 Mixin

最近几天 接触了 小程序 新出的 框架Donut
连带着JAVA 和 一堆新的东西 都学习下 顺便看了react Native

因为 要做一个 退出登录 和 注销的功能
在前一段时间 就想着 给原生小程序增加这两个功能也就摆上日程

昨天完成了 MIXIN
贴几个图 如果有啥问题 各位大神可以多提建议
也可以 直接粘了 去使用 嘿嘿

const lifeTimeKey = [
  'onLoad',
  'onReady',
  'onShow', ,
  'onHide', ,
  'onUnload', ,
  'onPullDownRefresh', ,
  'onReachBottom', ,
  'onShareAppMessage',
  'onPageScroll'
];

const OriginData = ['data'];
const self_circle = ['computed', 'watch'];

export default function (mix) {
  const that = this;
  mix.forEach(item => {
    console.log(item)
    Object.keys(item).forEach(key => {
      if (lifeTimeKey.includes(key)) {
        let p = that[key];
        that[key] = function (opt = {}) {
          p && typeof p === 'function' && p.call(this, opt);
          item[key].call(this);
        }
      } else if (OriginData.includes(key)) {
        that[key] = Object.assign({}, item[key], that[key]);
        that['$options'] = { ...that[key] };
      } else {
        that[key] = item.key
      }
    })
  })

  
  return that
}

import $Store from './store';
import minx from './minx';
import merge from './mixin';
/**
  * 全局混入
  * @param {Object} app 
  */

export let Mixin = function (app) {
  const Native = Page;
  let store = new $Store(app);
  app.globalData.store = store;
  const keyList = app.globalData.store._keyList;
  /**
   * 重构PAGE
   */
  Page = (config) => {
    let _onLoad = config.onLoad;
    let _onShow = config.onShow;

    config.onLoad = function (opt) {
      store.init(this);
      typeof _onLoad === 'function' && _onLoad.call(this, opt);
    }

    /**
     * 1 .  无法遍历 访问器的属性 也就是 当你设置了get set 就无法通过循环 获取到他的属性
     */
    config.onShow = function () {
      keyList.forEach(key => {
        this.setData({
          [`$store.state.` + key]: store.state[key]
        })
      })

      typeof _onShow === 'function' && _onShow.call(this);
    }

    config = minx.call(config, store);

    if (!Array.isArray(config.mixin)) {
      return Native(config)
    }

    const Mix = config.mixin;
    delete config.mixin;
    config = merge.call(config, Mix);

    Native(config);
  }
}

最后在App中 调用初始化 修改Page的方案 每一个页面就都使用了
构建MIXIN 完成 ...