1.定义
混入 (mixin) 提供了一种非常灵活的方式,来分发 Vue 组件中的可复用功能。一个混入对象可以包含任意组件选项。当组件使用混入对象时,所有混入对象的选项将被“混合”进入该组件本身的选项。
2.使用步骤
在components 文件夹中自定义名字,一般命名为mixin---》
文件夹中我们可以建立一个js文件,mixin.js 这个文件就是写混入代码的js----》
js代码内容如下:
export default {
data() {
return {
name : "张三"
}
},
methods: {
handleclick(){
this.name = "李四"
}
}
}
在需要用的页面引入
<template>
<div>
<h1>{{name}}</h1>
<button @click="handleclick">点我改名字11</button>
</div>
</template>
<script>
import minin from './minxin/minxin'
export default {
mixins: [minin],
data(){
return {
}
},
methods: {
}
}
</script>
引入之后就可以使用了,在上面的文件中,
handleclick 方法就是 混入文件中的方法