vue中mixin 混入
原创
©著作权归作者所有:来自51CTO博客作者wx58f59a601fad5的原创作品,请联系作者获取转载授权,否则将追究法律责任
<div id="app">
<p>num:{{ num }}</p>
<P><button @click="add">增加数量</button></P>
</div>
<script src="./node_modules/vue/dist/vue.js" charset="utf-8"></script>
<script>
var addLog={
updated(){
console.log("数据放生变化,变化成"+this.num);
}
}
Vue.mixin({
updated(){
console.log('这是全局混入的方法。。。');
}
})
var app=new Vue({
el:'#app',
data:{
num:1
},
methods:{
add:function(){
this.num++;
}
},
updated(){
console.log('这是组件 。。。。');
},
mixins:[addLog]
})
</script>
执行顺序: 全局 --》 mixin --》组件
这是全局混入的方法。。。
mix.html:21 数据放生变化,变化成2
mix.html:42 这是组件 。。。。