混入对象包含任意组件选项,用于分发组件的可复用功能;组件使用混入对象时,混入对象的组件选项混合到该组件本身的选项中。mixins选项接受一个混入对象的数组。
混入策略:
同名选项合并,数据冲突组件数据优先,同名钩子函数合并为数组,混入对象钩子比自身钩子函数先调用。
定义混入对象: var mymixin = { 组件选项 }
定义一个使用混入对象的组件:
var Component = Vue.extend({
mixins: [myMixin]
})
var component = new Component() // => "hello from mixin!"
官网中使用了Vue.extend这个构造器创建一个"子类",参数是一个包含组件选项的对象,其中data必须是一个函数。
var name = Vue.extend({
template:'',
data(){ return{ } }
})
new name().$mount('#元素id名') //创建name实例,挂载到一个元素上
Vue.extend有点类似于Vue.component,但extend创建的是Vue构造器,并不是组件实例。
所以不可以通过new Vue({ components: testExtend } 来直接使用,需要通过 new Profile().$mount('#mount-point') 来挂载到指定的元素上。
参考:https://www.cnblogs.com/hentai-miao/p/10271652.html
网友评论