微信小程序封装mixins方法

在app.js中这样引入

import '@src/utils/mixins'

mixins函数如下

/**
 * 封装类似vue的混入功能
 */
let native = Page
Page = (obj) => {
  let {mixins = []} = obj
  let merge = new Merge()
  Reflect.deleteProperty(obj, 'mixins')
  let pageData = mixins.length <= 0 ? obj : merge.start(obj, ...mixins)
  native(pageData)
}
class Merge {
  constructor () {}
  start (rootObj, ...objs) {
    let root = {}
    objs.forEach((el) => {
      root = Merge.recursive(rootObj,el)
    })
    return root
  }
  static recursive = (rootObj,obj) => {
    for (let attr in obj) {
      if(rootObj[attr] === undefined) {
        rootObj[attr] = obj[attr];
      } else if (Merge.isObject(obj[attr])) {
        Merge.recursive(rootObj[attr],obj[attr])
      } else{
        rootObj[attr] = obj[attr]
      }
    }
    return rootObj
  }
  static isObject = (obj) => {
    return Object.prototype.toString.call(obj).includes('Object')
  }
}

　　需要混入的文件mixin1.js

module.exports = {
    data: {}
}

　　混入的页面JS文件

import mixins from '@src/mixins/mixin1.js'
Page({
  mixins: [mixins],
  data: {}
})

　　

参考:https://www.cnblogs.com/aaron---blog/p/9406545.html