前台开发时,在每个页面写接口请求,存在问题
问题:
1. 重复请求代码
2. 不利于维护
最初:www.abc.com/api
后修改:www.def.com/api
3. 不便于集中处理某些操作
请求 成功
请求 失败?
请求 有访问限制?
so,当请求比较庞大、接口复杂时,建议采用模块化方式管理接口请求:
1> 接口模块化
创建/src/api/
|- index.js 入口
|- path.js 接口管理
|- http.js axios配置、封装
|- assets.js 资产接口
|- region.js 区域接口
|- ...
2> 挂在全局
main.js
import api from "./api/index"
Vue.prototype.api = api;
3> 在页面中使用接口
访问api模块:this.api.xxx
xxx.vue在某一个页面使用
mounted(){
this.api.assets.all().then(res=>{
})
}
【ps:本文不足之处,欢迎指正,感谢。】