改装OMIX2.0小程序框架，使app.js能够使用状态管理

场景

腾讯原生小程序框架 OMIX2.0现在支持的是在页面中去使用状态管理，但实际工作中很多情况下需要我们在app.js中就去使用状态管理，比如说在onLaunch中我们需要授权登录并且获取用户的信息，这些就会需要在获取后用状态管理及时存储，方便以后的使用。所以我们需要对其改装。

改装

目前我使用的是2.4.0版本，如果不知道的话可以在utils中的create.js中最上面注释查看版本号。

打开create.js，找到create方法。

function create(store, option) {
  if (arguments.length === 2) {
    if (!store.instances) {
      store.instances = {}
    }

    if (!store.__changes_) {
      store.__changes_ = []
    }

    const changes = store.__changes_
    if (!store.onChange) {
      store.onChange = function (fn) {
        changes.push(fn)
      }
    }

    if (!store.offChange) {
      store.offChange = function (fn) {
        for (let i = 0, len = changes.length; i < len; i++) {
          if (changes[i] === fn) {
            changes.splice(i, 1)
            break
          }
        }
      }
    }
    const hasData = typeof option.data !== 'undefined'
    let clone
    if (option.data) {
      clone = JSON.parse(JSON.stringify(option.data))
      option.data.$ = store.data
    } else {
      option.data = store.data
    }
    observeStore(store)
    const onLoad = option.onLoad
    const onUnload = option.onUnload

    option.onLoad = function (e) {
      this.store = store

      option.use && (this.__updatePath = getPath(option.use))
      this.__use = option.use
      this.__hasData = hasData
      if (hasData) {
        Object.assign(option.data, JSON.parse(JSON.stringify(clone)))
      }
      store.instances[this.route] = store.instances[this.route] || []
      store.instances[this.route].push(this)
      this.computed = option.computed
      this.setData(option.data)
      const using = getUsing(store.data, option.use)

      option.computed && compute(option.computed, store, using, this)
      this.setData(using)

      onLoad && onLoad.call(this, e)
    }

    option.onUnload = function (e) {
      store.instances[this.route] = store.instances[this.route].filter(ins => ins !== this)
      onUnload && onUnload.call(this, e)
    }

    Page(option)
  } else {
    store.lifetimes = store.lifetimes || {}
    const ready = store.lifetimes.ready || store.ready

    store.ready = store.lifetimes.ready = function () {
      const page = getCurrentPages()[getCurrentPages().length - 1]
      store.use && (this.__updatePath = getPath(store.use))
      this.store = page.store
      this.__use = store.use

      this.computed = store.computed
      store.data = this.store.data
      this.setData(store.data)
      const using = getUsing(this.store.data, store.use)

      store.computed && compute(store.computed, this.store, using, this)
      this.setData(using)

      page._omixComponents = page._omixComponents || []
      page._omixComponents.push(this)
      ready && ready.call(this)
    }
    Component(store)
  }
}
create.Page = function (store, option) {
  create(store, option)
}

将if语句中的 Page(option)放入create.Page中

create.Page = function (store, option) {
  create(store, option)
  Page(option)
}

这样就可以在app.js中使用了，引入create.js和store中的index.js.在app.js中直接写store.data.xxx就好