Vue的HOC实现

//Parent.vue
import Base from ‘.Base.vue‘;
// 使用hoc替代minxin
import HOC from ‘.hoc‘;
const wrapBase = HOC(Base);

export default { 
  components: {
      Base,
      wrapBase
  },
  //...
}

//完整hoc.js
export default function HOC(Base) {
    return {
      mounted () {
        console.log(‘我是HOC mounted log‘)
      },
      props: Base.props,
      render (h) {
        const slots = Object.keys(this.$slots)
          .reduce((acc, cur) => acc.concat(this.$slots[cur]), [])
          // 手动更正 context
          .map(vnode => {
            vnode.context = this._self //绑定到高阶组件上
            return vnode
          })

        return h(Base, {
          on: this.$listeners,
          props: this.$props,
          attrs: this.$attrs
        }, slots)
      }
    }
}