Vue cli mixin (混入)

1、功能

可以把多个组件共用的配置提取成一个混入对象

2、使用方式

a、创建混入(mixin.js文件)

import { computed } from "vue"export const mixin = {methods: {showName(){alert(this.name)}},data() {return {}},computed:{},}

b、使用混入

局部

<script>// 引入import {mixin} from '../mixin'export default {name:'StudentData',data() {return {name:'jojo',sex: 'male',}},
/*         methods: {showName(){alert(this.name)}}, */// 使用
        mixins:[mixin],}
</script>

全局 main.js中

import {mixin} from './mixin'
Vue.mixin(mixin)

3、一般Vue属性和方法，组件的权重大于mixin.js中的，但是生命周期钩子是个例外，都执行