Vue中使用mixins混入方式

// 引入下载文件接口
import { downTemplateFile } from '@/api/home'
// 导出 myMixins 函数
export const myMixins = {
  data() {
    return {

    }
  },
  methods: {
    // 下载方法，参数传文件ID
    toLogin(id) {
      downTemplateFile({ id1: id }).then(res => {
        if (res.size != 97) {
          let blob = new Blob([res])
          let objectUrl = window.URL.createObjectURL(blob)
          if (navigator.msSaveBlob) {
            return navigator.msSaveBlo(blob, '下载文件.doc')
          } else {
            let a = document.createElement('a')
            document.body.appendChild(a);
            a.style.display = 'none'
            a.setAttribute('href', objectUrl)
            a.setAttribute('download', '下载文件.doc')
            a.click();
            URL.revokeObjectURL(objectUrl);
          }
        } else {
          this.$message.error('系统错误，请稍后重试！')
        }
      })
    }
  }
}

<template>
  <div class="index">
    <button @click="downLoadTempFile(1)">触发mixins下载方法</button>
  </div>
</template>
<script>
// 引入 myMixins 函数，导出什么就引入什么
import { myMixins } from '@/mixins';
export default {
  data(){
    return {
    }
  },
  // 注册
  mixins: [myMixins],
  methods:{
    async downLoadTempFile(id){
      // 直接使用this.方法名就可以调用到myMixins里的方法
      this.toLogin(id)
    },
  }
}
</script>

import Vue from 'vue'
import App from './App.vue'

import { myMixins } from "@/mixins"

Vue.mixin(myMixins);

Vue.config.productionTip = false

new Vue({
  render: h => h(App),
}).$mount('#app')