Mixin简单复用

一、Mixin简单复用

在src/mixin目录下创建，例如
src/mixin/common_hi_test.js

export default {
    methods:{
        hi : function (name) {
            return "欢迎光临~"+ name;
        }
    }
}

二、直接引用

1.在src/components/SayHiFromMixin.vue                
2.在mounted()中调用，需要带this关键字

代码如下（示例）：

<template>

    <div>
        {{hi("路明非飞飞飞")}}

    </div>

</template>
<script>
    import Common_hi_test from '@/mixins/common_hi_test.js'

    export default {

        mixins: [Common_hi_test],
        mounted(){

            alert(this.hi('嘻嘻嘻嘻弹框'))

        }

    }


</script>

2.路由

代码如下（示例）：

 {
            path: '/sayHiFromMixin_test', //路径
            name: 'sayHiFromMixin_test',//vue内部使用的名称
            component: SayHiFromMixin_test //对应的.vue页面名字
        }

总结

记录学习轨迹