vue.js中的mixins
mixins:混入;分为两种,一种是局部混入,一种是全局混入
局部混入
new Vue可以称之为组件或者是根实例,组件中的各种方法全部堆放在组件中,分工不够明确,出了问题就只能找组件的麻烦,所以vue.js就推出了一种方法,mixins。
在组件外创建一个对象,里面写入组件中的其中一个方法,然后在组件中写入mixins:[ obj1,obj2,obj3];
外部写的方法和组件中的方法不冲突,外部写了组件内还可以写,如果对象名相同,就以组件中的对象方法为主
<script>
var mixin = {
methods: {
sum(){
alert( 10*10 )
}
},
}
new Vue({
el: '#app',
data: {},
watch: {},
mixins: [mixin],
methods: {
redecer(){
alert( 100-10 )
},
sum(){
alert('张骏')
}
},
computed: {}
})
</script>
全局混入
全局混入就是Vue.mixins();
同样,外部的方法和内部不冲突,如果方法名相同,就以内部的为主,全局混入就相当于总部和分部的区别,一切听总部的
<script>
Vue.mixin({
methods: {
changeName(){
alert('zhangjun')
}
}
})
new Vue({
el: '#app',
data: {},
watch: {},
methods: {
redecer(){
alert( 100-10 )
},
sum(){
alert('张骏')
}
},
computed: {}
})
</script>