1. 功能:可以把多个组件共用的配置提取成一个混入对象
2. 使用方式:
第一步定义混合:
```
{
data(){....},
methods:{....}
....
}
```
//mixin.js
export const hunhe = {
methods: {
showName(){
alert(this.name)
}
},
mounted() {
console.log('你好啊!')
},
}
export const hunhe2 = {
data() {
return {
x:100,
y:200
}
},
}
第二步使用混入:
全局混入:```Vue.mixin(xxx)``
//全局引用
//miain.js中添加
Vue.mixin(hunhe)
Vue.mixin(hunhe2)
局部混入:```mixins:['xxx'] ```
//局部引入
//school.vue
<template>
<div>
<h2 @click="showName">学校名称:{{name}}</h2>
<h2>学校地址:{{address}}</h2>
</div>
</template>
<script>
引入一个hunhe
import {hunhe,hunhe2} from '../mixin'
export default {
name:'School',
data() {
return {
name:'哈尔滨理工大学',
address:'哈尔滨',
x:666
}
},
mixins:[hunhe,hunhe2],
}
</script>