Vue中 混入（mixin）的使用

1. 功能：可以把多个组件共用的配置提取成一个混入对象
2. 使用方式：
   （1）定义混合 创建一个单独的mixin.js文件，将共用的配置提取出 来，置入新创建的文件中（对外暴露）
   （2）页面中 导入 import {mixin} from './mixin.js
   局部混入：vue实例中 mixins:[mixin]
   全局混入：main.js中 Vue.mixin(mixin)
3. 特点：当组件和混入对象含有同名选项时，这些选项将以恰当的方式进行“合并”
   （1）数据对象在内部会进行递归合并，并在发生冲突时以组件数据优先；
   （2）混入对象的钩子将在组件自身钩子之前调用；

// 创建mixin.js文件
export const mixin = {
    data() {
        return {
          name2: "陕西之王222",
        };
      },
    methods: {
        showName() {
            alert(this.name);
        },
      
    },
    mounted(){
        console.log('混入执行')
    }
}
// 页面中使用
import {mixin} from './mixin.js    //引入混入
export default {
  name: "School",
  data() {
    return {
      name: "陕西之王",
      address: "山西省太原市",
    };
  },
  mixins: [mixin],  //使用混入
};