vue封装axios(大佬们改回来了,asiox 嘻嘻)

关于vue封装axios

首先建了3个文件夹,作为存储,也就是3个模块

分别是config,untils,services

配置文件夹

config中我存放的是接口的域名,因为同一个项目中接口的前缀也就是域名都是相同的,当我们向后台请求数据的时候,肯定不止一个数据,这样请求就会很繁琐,代码块重复,也不利于维护修改。 

封装域名

而当我们需要使用这些域名时 ,在main.js中引入,就可以使用了

untils中存放封装好的axios请求方法  当需要向后台请求数据的时候调用就好

封装axios方法

axios中使用promise进行异步操作,resolve,reject中使用箭头函数来处理请求的数据结果

services中就是我们向接口请求数据了,


向后台接口请求数据

在product中引入刚才封装好的axios方法,因为axios请求后返回的是数据,所以必须return一下 ,否则拿不到数据,

组件中需要向后台请求数据的时候,直接引入product,再new实例化一下,proto连接原型链,就可以在组件中调用product中的方法了,可以传参数进行接口的参数拼接,来获取数据


组件中引入product并实例化


组件内调用封装好的axios方法 lisrparams作为参数

你可能感兴趣的:(vue封装axios(大佬们改回来了,asiox 嘻嘻))