mixin:一个混入对象可以包含任意组件选项。当组件使用混入对象时，所有混入对象的选项将被“混合”进入该组件本身的选项。 mixin也跟vue对象一样含有vue的生命周期和data，methods等用法
<div id="app"> <component-A></component-A> <component-B></component-B> </div> <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script> <script> const mixA = { data(){ return { count:0 } }, created: function () { console.log('混入对象的钩子被调用') }, methods:{ addCount(){ this.count++; } } } Vue.component('componentA',{ mixins:[mixA], data(){ return{ aa:'' } }, template:` <div> <p>{{count}}</p> <button @click='addCount'>+</button> </div> `, created: function () { console.log('组件被调用') }, mounted(){ console.log(this.$data); } }) Vue.component('componentB',{ mixins:[mixA], template:` <div> <p>{{count}}</p> <button @click='addCount'>+</button> </div> ` }) const app = new Vue({ el:'#app', }) </script>注意：mixin里的数据在几个组件里是独立的，然后含有同名选项时，这些选项将以恰当的方式进行“合并”。data里的会以组件为准，同名钩子函数都会调用，会先执行mixin的方法再到组件。
