vue之混入 - mixin

vue之混入 - mixin

1. 混入 (mixin) 提供了一种非常灵活的方式，来分发 Vue 组件中的可复用功能。一个混入对象可以包含任意组件选项。当组件使用混入对象时，所有混入对象的选项将被“混合”进入该组件本身的选项。

2 .当混入对象内有选项和组件内的选项重复时

• 函数类会被放在一个数组中，都会执行，混入对象内的函数先执行
• 对象类会被合并，重复的数据，以组件内部的数据为准

// mixins.js
export default {
    created () {
        console.log('mixins - created')
    },
    data: {
        a: 10,
        b: 'hello'
    }
}

// 某组件
import mixin from './xxx/mixins.js'
export default {
    mixins: [mixin],
    data: {
        a: '3.14',
        c: 'components'
    },
    created () {
        console.log('components - created')
    }
}