vue-mixin:混入怎么用

1.目录里创建一个名为mixin.js的文件

2.定义一个混入对象（我一般局部使用）

// vue中的data,methods，钩子函数同样可以写进这个mixin对象中，可以定义初始的方法，方便调用
export const mixin = {
    methods: {
        hello(){
            console.log('hello-mixin中的hello方法');
        }
    },
    created: function () {
        // 混入对象的钩子函数将在组件自身钩子之前调用
        console.log('mixin - 成功创建啦');
    }
};

3.在需要的组件中引入这个mixin.js

...
<script>
    import { mixin } from '@/mixin';
    export default {
        name: 'myDemo',
        mixins: [ mixin ],  //混入
        data(){
            return {}
        },
        methods: {},
        mounted () {
        	this.hello()
        }
    };
</script>

4.现在就已经完成混入的基本使用了，在相应的组件里就可以使用mixin.js中的方法或者属性。

作者：望野之叶
本人web前端小白，只是用博客作为笔记！