混入mixin:(vue2是深合并,vue3是浅合并)
1)局部混入(只有当前进行混入的实例可以使用)
-- 外部定义若干个要混入实例的对象;
-- 在实例内容使用: mixins:[混入对象1,混入对象2,...];
-- 对于混入的data,methods选项;(如果有重复,以实例对象里面的为准)
// 书写一个对象,这个对象里面是可复用的内容
var mixinObj = {
data() {
return {
flag: true,
};
},
methods: {
addTask() {
this.tasks.push("打豆豆");
},
},
};
实例进行混入:
let vm1 = new Vue({
el: "#app",
data() {
return {
flag: 34,
tasks: ["吃饭", "睡觉"],
};
},
// 局部混入
mixins: [mixinObj],
});
2)全局混入:(每个vue实例都会受影响)
-- Vue.mixin(要全局混入的对象);
-- 一般在别人做插件的时候使用;
var obj = {
data() {
return {
id: 1,
};
},
};
Vue.mixin(obj);
//每个实例对象都会有data里的数据