Vue 抽取可复用的网络请求方法到js文件

混入 Mixin

官网对混入的介绍

混入 (mixin) 提供了一种非常灵活的方式,来分发 Vue 组件中的可复用功能。一个混入对象可以包含任意组件选项。当组件使用混入对象时,所有混入对象的选项将被“混合”进入该组件本身的选项。

定义 mixin文件

新建mixin.js

export const SendMixin = {
    methods:{
        send(id){
            console.log('发起网络请求:',id);
            this.$request()...
        },
    }
}

使用

  1. 在.vue文件中引入
import {SendMixin} from '/path/xxxMixin.js'
export default{
    mixins: [SendMixin],
}
  1. 调用
methods:{
    sendMsg(){
        ....
        this.send(id)
        ...
    }
}