在 Vue 项目中公用化接口请求的方法：创建服务模块（services 文件夹及 api.js 文件）。封装接口请求（在 api.js 中封装各个接口的请求方法）。在 Vue 组件中使用（导入 api.js 模块并使用封装好的请求方法）。在 Vuex 中使用（可选，导入 api.js 模块并使用）。
Vue 接口公用化
问题：如何在 Vue 项目中公用化接口请求？
回答：
DaGaoPeng(大高朋网团购程序)
下载
大高朋团购系统是一套Groupon模式的开源团购程序，开发的一套网团购程序，系统采用ASP+ACCESS开发的团购程序，安装超简，功能超全面，在保留大高朋团购系统版权的前提下，允许所有用户免费使用。大高朋团购系统内置多种主流在线支付接口，所有网银用户均可无障碍支付；短信发送团购券和实物团购快递发货等。 二、为什么选择大高朋团购程序系统？ 1.功能强大、细节完善 除了拥有主流团购网站功能，更特别支
在 Vue 项目中，可以通过以下步骤公用化接口请求：
立即学习“前端免费学习笔记（深入）”；
-
创建服务模块：创建
services文件夹，并在其中创建一个api.js文件。 -
封装接口请求：在
api.js文件中，封装各个接口的请求方法，如：
import axios from 'axios';
const api = {
getUser(id) {
return axios.get(`api/users/${id}`);
},
createUser(user) {
return axios.post('api/users', user);
},
};
export default api;-
在 Vue 组件中使用：在需要使用接口请求的 Vue 组件中，导入
api.js模块并使用封装好的请求方法，如：
import api from '@/services/api';
export default {
methods: {
getUser(id) {
return api.getUser(id).then(res => res.data);
},
createUser(user) {
return api.createUser(user).then(res => res.data);
},
},
};-
在 Vuex 中使用（可选）：如果需要在 Vuex 中使用接口请求，可以将
api.js模块导入 Vuex 状态管理模块并使用，如：
import Vue from 'vue';
import Vuex from 'vuex';
import api from '@/services/api';
Vue.use(Vuex);
const store = new Vuex.Store({
state: {},
getters: {},
actions: {
getUser(context, id) {
return api.getUser(id).then(res => res.data);
},
createUser(context, user) {
return api.createUser(user).then(res => res.data);
},
},
mutations: {},
});
export default store; 
