Vue的mixin的使用（抽取多个vue页面的公共内容，放在mixin中再从多个vue页面引用mixin定义的内容并使用）

路光.

于 2021-10-03 18:02:40 发布

阅读量526

点赞数

分类专栏： Vue

本文链接：https://blog.csdn.net/qq_41429765/article/details/120596848

版权

Vue.js mixin 数据共享方法复用组件

关键词由CSDN通过智能技术生成

Vue 专栏收录该内容

62 篇文章 0 订阅

订阅专栏

创建mixin.js(名称没有限制可任意名称)

export default {
    data(){
        return{
            tt:1,
            cc:2
        }
    },
    methods:{
        jumpClick(){
            console.log('触发了跳');
        }
    }

}

在其他页面中引用mixin.js

<template>
  <div class="home">
    <p>tt的值：{{tt}}</p>
    <p>cc的值：{{cc}}</p>
  </div>
</template>

<script>
 //引用mixin.js使用mixin.js定义的内容 
 import mixin from './mixin'  
  export default {
     //声明引用的mixin，如果使用多个则在数组中继续追加即可
      mixins:[mixin]
  }
</script>