混入(mixin)提供了一种灵活的方式，将组件中可复用的功能分发到多个组件中。一个混入对象可以包含任意组件选项，当组件使用混入对象时，所有混入对象的选项将被"混合"进入该组件本身的选项。
当多个组件有相同的逻辑时，可以使用混入来复用代码：
const myMixin = {
created() {
console.log('混入的 created 钩子')
},
methods: {
hello() {
console.log('Hello from mixin!')
}
}
}
new Vue({
mixins: [myMixin],
created() {
console.log('组件的 created 钩子')
}
})
| 特性 | 混入 | 组件 |
|---|---|---|
| 复用方式 | 合并选项 | 组合嵌套 |
| 数据来源 | 直接合并 | props 传递 |
| 适用场景 | 共享逻辑 | 共享 UI |
| 灵活性 | 较高 | 较低 |