Mixins混入 实现代码复用

代码复用的一个属性,一般都是在复用生命周期函数

在src下创建 mixins 文件夹/index.js js文件，写入：

export const MixinsFn = {
    //混入对象中可以像正常对象一样拥有值与函数
    data(){
        return {
　　　　　　msg:"您好"
       }
    }
    methods: {
        fn() {console.log("这是fn");}
    }
    //亦或是生命函数也可以使用
    created() { console.log("这是mixins触发的created"),}
    }

引用mixins

<script>
//导出了混入对象后就需要在组件中引入
import { MixinsFn } from '@/mixins/index.js'   
export default {
  created(){
    console.log("这是此页面触发的created")
  },
  //调用混入对象  
  mixins: [MixinsFn] 
  this.fn(); //调用mixins中的方法
}
</script>

我们会发现，mixins中的created 比 引入页面中的created 优先执行。