mixin 混入/混合

mixin 可以把多个组件公用的配置提取成一个混入对象。

示例：定义一个混合 mixin.js

export const mixin = {
    methods: {
        sayHello() {
            alert(this.name)
        }
    }
}

在组件中使用混合：

<script>
// 引入混合中的mixin
import {mixin} from '../mixin'
export default {
    name: 'School',
    data() {
        return {
            name: '庞各庄小学',
            address: '庞各庄'
        }
    },
    mixins: [mixin]  // 此时该组件便有了mixin中定义的sayHello方法
}
</script>

组件中可以使用的配置项，在混合中都可以进行配置：

export const mixin2 = {
    data() {
        return {
            msg: 'hello'
        }
    }
}

也可以全局使用混合，在main.js中进行配置：

import {mixin2} from './mixin'
// 此时，所有的vm、vc都有了mixin2中定义的msg变量
Vue.mixin(mixin2)