mixin是一个包含可被其他类使用而无需继承的方法的类。
mixin提供了实现特定行为的方法,但是我们不单独使用它,而是使用它来将这些行为添加到其他类中。
例如,在Vue中,提供了Vue.mixin API将mixin类添加到Vue实例上,可以像访问Vue实例属性一样访问mixin类中声明的属性和方法
Vue中的全局混入
// 为自定义的选项 'myOption' 注入一个处理器。
Vue.mixin({
created: function () {
var myOption = this.$options.myOption
if (myOption) {
console.log(myOption)
}
}
})
new Vue({
myOption: 'hello!'
})
// => "hello!"
Vue在自定义组件上混入
// 定义一个混入对象
var myMixin = {
created: function () {
this.hello()
},
methods: {
hello: function () {
console.log('hello from mixin!')
}
}
}
// 定义一个使用混入对象的组件
var Component = Vue.extend({
mixins: [myMixin]
})
var component = new Component() // => "hello from mixin!"