理解：一個(gè)混入對(duì)象可以包含任意組件選項(xiàng)石挂，這些選項(xiàng)將混入到組件本身的選項(xiàng)；
作用：用來(lái)分發(fā)Vue組件中的可服用功能；
局部混入
//選項(xiàng)合并
var mixin = {
data: function () {
return {
message: 'hello',
foo: 'abc'
}
},
created: function () {
console.log('混入對(duì)象的鉤子被調(diào)用');
},
methods: {
foo: function () {
console.log('foo')
},
conflicting: function () {
console.log('from mixin')
}
}
}
// => "混入對(duì)象的鉤子被調(diào)用"
// => "組件鉤子被調(diào)用"
new Vue({
mixins: [mixin],
data: function () {
return {
message: 'goodbye',
bar: 'def'
}
},
created: function () {
console.log('組件鉤子被調(diào)用');
console.log(this.$data)
// => { message: "goodbye", foo: "abc", bar: "def" }
},
methods: {
bar: function () {
console.log('bar')
},
conflicting: function () {
console.log('from self')
}
}
})
vm.foo() // => "foo"
vm.bar() // => "bar"
vm.conflicting() // => "from self"
通過(guò)上面的例子，可以得出結(jié)論：
- 當(dāng)組件和混入對(duì)象含有同名選項(xiàng)時(shí)倘零，這些選項(xiàng)將以恰當(dāng)?shù)姆绞竭M(jìn)行“合并”,
發(fā)生沖突時(shí)以組件數(shù)據(jù)優(yōu)先 - 同名鉤子函數(shù)將合并為一個(gè)數(shù)組，因此都將被調(diào)用戳寸。另外呈驶，混入對(duì)象的鉤子將
在組件自身鉤子之前調(diào)用。 - 值為對(duì)象的選項(xiàng)疫鹊，例如 methods袖瞻、components 和 directives司致，將被合并為同
一個(gè)對(duì)象。兩個(gè)對(duì)象鍵名沖突時(shí)聋迎，取組件對(duì)象的鍵值對(duì)脂矫。
全局混入
一旦使用全局混入，它將影響每個(gè)單獨(dú)創(chuàng)建的 Vue 實(shí)例 (包括第三方組件)霉晕，項(xiàng)目開(kāi)發(fā)中不推薦庭再，請(qǐng)謹(jǐn)慎使用。
