Vue mixins 混入

Vue mixins

混入： 把多个组件共用的配置抽取成一个混入对象
全局混入：Vue.mixin(xxx)
局部混入：mixins:[xxx]
数据冲突，以组件生命的数据为主
生命钩子重复，mixin和组件的生命钩子都触发，并且mixin中的钩子先执行

定义mixin

export const myMixin = {
    methods:{
        showMsg(){
            console.log(this.msg);
        }
    }
}

使用mixin

import {myMixin} from '../mixin'
export default {
  data: () => ({}),
  props: ["msg"],
  mixins:[myMixin]
};