锐客网

  1. 首页 > it技术 > >

vue|vue 使用axios发送请求或带参数的请求

vueaxios

首先，在main.js中引入vue|vue 使用axios发送请求或带参数的请求
文章图片
在这个时候，你还是无法在组件中使用axios的，但如果将vue改为vue的原型链，就可以解决这个问题，如下图
【vue|vue 使用axios发送请求或带参数的请求】vue|vue 使用axios发送请求或带参数的请求
文章图片

开始发送请求 vue|vue 使用axios发送请求或带参数的请求
文章图片

vue|vue 使用axios发送请求或带参数的请求
文章图片

带参数的请求 如果想要发送带json格式参数的请求，则需要使用qs模块来处理参数
首先在main.js中导入qs模块
vue|vue 使用axios发送请求或带参数的请求
文章图片

然后使用qs处理参数
简单来说：qs是查询字符串解析和将对象序列化的库；而vue在请求的时候，当我们的data中有数组的时候，是需要序列化才能与后台进行通讯的。
qs的应用：

  • npm 下载qs库：npm i qs
  • 在vue项目页面或者封装的axios中引用： import Qs from ‘qs’；
  • qs主要有两种使用方法：qu.stringify()和qs.parse();
  • qu.stringify():将对象序列化成url的形式；以&进行拼接
  • qs.parse():将url解析成对象形式；
vue|vue 使用axios发送请求或带参数的请求
文章图片

最终返回结果如下
vue|vue 使用axios发送请求或带参数的请求
文章图片

回调函数的简写 vue|vue 使用axios发送请求或带参数的请求
文章图片

如果在vue中使用，那么vue中data中的数据无法通过this直接引用，需要做如下处理
vue|vue 使用axios发送请求或带参数的请求
文章图片

    推荐阅读


    上一篇：A+|已经结算的维修单在:维修管理、快修管理、维修档案、（营业额、成本、利润）报表 不显示

    下一篇：weblogic|weblogic——Servlet failed with Exception