mixin多种方法复用封装

适用场景

多个地方都用到的methods方法，采用mixin把方法抽离到一起，随后直接引入就可以

1.局部引用

新建一个mixins文件夹，写入你需要的方法

export const mixin = {
  methods: {
    showName() {
      alert(222)
    }
  },
  mounted() {
    console.log('jiesuema');
  },
}

2.在对应的页面引入即可

<template>
  <div>
    <h3  @click="showName">2222</h3>
  </div>
</template>

<script>
// 这是局部挂载
import {mixin} from '@/mixins/mixin.js'
export default {
  data() {
    return {
      
    }
  },
  mixins:[mixin]

}
</script>

<style>

</style>

2.全局导入

import { mixin } from "./js/mixin.js";
Vue.mixin(mixin)