vue中的minix
minix 是个什么东西， 就是混合，把你混合给我
浅显表述就是
你说 ： ‘我叫李四’，
我说 ： ‘我叫张三’，
然后把你 混合给我， 就成了
我说 ： ‘我叫张三我叫李四’，
所有解说都在例子里，如下：
// minix.js
export default {
data () {
return {
name: 'minix',
minixName: 'minixObj',
flag: false
}
},
mounted() {
console.log('minixMounted');
},
methods: {
speak() {
console.log('this is minix');
},
getData() {
return '100';
}
}
}// todo.vue
import myMinix from './minix';
export default {
data () {
return {
name: 'todo',
lists: [1, 2, 3, 4]
}
},
mounted() {
console.log('todoMounted');
},
minixs: [myMinix], // todo.vue 中声明minix 进行混合
methods: {
speak () {
console.log('this is todo');
},
submit() {
console.log('submit');
},
}
}//==========
// 最终得到的结果
//==========
export default {
data () {
return {
name: 'todo', // 共同有的data， 最后保留自己的data
lists: [1, 2, 3, 4], // 自己独有的，保留
minixName: 'minixObj', // todo没有的，会被添加进来
flag: false // todo没有的，会被添加进来
}
},
mounted() {
// 在钩子函数中的， 会被合并到todo.vue 的钩子函数中， minix中的代码在前，自己的在后
console.log('minixMounted');
console.log('todoMounted');
},
methods: {
// 同时有的方法， 会被封装为一个数组， 先执行minix中的，后执行todo自己的
speak () {
[
function() {
console.log('this is minix');
},
function() {
console.log('this is todo');
}
].forEach(item => {
item();
})
},
// 自己独有的，保留
submit() {
console.log('submit');
},
// 自己没有的方法会被添加进来
getData() {
return '100';
}
}
}本面试题为前端常考面试题，后续有机会继续完善。我是歌谣，一个沉迷于故事的讲述者。
欢迎一起私信交流。