Vue 请求传公共参数的操作


Posted in Javascript onJuly 31, 2020

我就废话不多说了,大家还是直接看代码吧~

// An highlighted block
//http request拦截器
axios.interceptors.request.use(
	config =>{
  const token = window.sessionStorage.getItem('Tk_token')
  const user_id=window.sessionStorage.getItem('Tk_user_id')

 // config.data = JSON.stringify(config.data);
 // config.headers = {
 //  'Content-Type':'application/x-www-form-urlencoded'
 // }
  if(token){
   config.params = {'token':token,'user_id':user_id}
  }
  console.log(config);
		return config;
	},
	err =>{
		return Promise.reject(err);
	}
)

补充知识:Vue联合axios发送后台post请求时的参数问题

开始用的是vue-resource,后来发现这个已经很久没有更新了,作者已经停止更新了,而且就连作者也推荐用axios,那么我就用axios吧,改成axios之后,就出现了一个问题:参数问题。

怎么个参数问题呢?用vue-response来发送post请求的时候,传入的参数到后台是一个一个分开的,比如传了参数

{
  username:'name1',
  password:'pwd1'
}

就是很简单的用户名和密码,vue-resource传到后台之后,后台的接口方法参数是两个,一个是username,一个是password,都可以分别取到;但是axios不同,axios到后台之后,是一个map结构的对象,需要用@RequestBody Map map这种方式来获取,然后从map中一个一个取出来,这样也可以。但是有没有办法让axios传给后台的参数也是一个一个的呢?当然有。

第一个方法就是URLSearchParams,用这个添加好参数,到后台就是一个一个的,但是这个IE不支持。

还有一个办法,就是qs,qs的话有两种引入方式,一种就是用npm安装好后,直接import,然后就可以用了;另一种就是在页面直接引入qs.js,就是<script src='js/qs.js'></script>这种方式,然后

注意了!

这里要注意了!

如果是import方式引入的,我们就用qs.stringify调用就好了,但是!!!

注意了!

如果是js文件引入的方式,用的Qs,不是qs,Q是大写的Q,也就是Qs.stringify。

然后就可以了!

以上这篇Vue 请求传公共参数的操作就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
javascript面向对象编程(一) 实例代码
Jun 25 Javascript
Jquery+WebService 校验账号是否已被注册的代码
Jul 12 Javascript
JSChart轻量级图形报表工具(内置函数中文参考)
Oct 11 Javascript
Javascript面向对象编程(二) 构造函数的继承
Aug 28 Javascript
js将iframe中控件的值传到主页面控件中的实现方法
Mar 11 Javascript
js关于命名空间的函数实例
Feb 05 Javascript
AngularJS实现一次监听多个值发生的变化
Aug 31 Javascript
JavaScript实现汉字转换为拼音的库文件示例
Dec 22 Javascript
完美实现js拖拽效果 return false用法详解
Jul 28 Javascript
jQuery实现点击自身以外区域关闭弹出层功能完整示例【改进版】
Jul 31 jQuery
vue实现评论列表功能
Oct 25 Javascript
vue动态设置路由权限的主要思路
Jan 13 Vue.js
vue2.0 解决抽取公用js的问题
Jul 31 #Javascript
vue实现公共方法抽离
Jul 31 #Javascript
js实现无缝轮播图插件封装
Jul 31 #Javascript
原生js滑动轮播封装
Jul 31 #Javascript
Vue+ElementUI 中级联选择器Bug问题的解决
Jul 31 #Javascript
jquery轮播图插件使用方法详解
Jul 31 #jQuery
在Uni中使用Vue的EventBus总线机制操作
Jul 31 #Javascript
You might like
php输出表格的实现代码(修正版)
2010/12/29 PHP
kohana框架上传文件验证规则写法示例
2014/07/14 PHP
php检索或者复制远程文件的方法
2015/03/13 PHP
img的onload的另类用法
2008/01/10 Javascript
强大的jquery插件jqeuryUI做网页对话框效果!简单
2011/04/14 Javascript
自己动手制作jquery插件之自动添加删除行功能介绍
2011/10/14 Javascript
为JS扩展Array.prototype.indexOf引发的问题探讨及解决
2013/04/24 Javascript
元素未显示设置width/height时IE中使用currentStyle获取为auto
2014/05/04 Javascript
jQuery实现公告新闻自动滚屏效果实例代码
2016/07/14 Javascript
Servlet实现文件上传,可多文件上传示例
2016/12/05 Javascript
Vue过滤器的用法和自定义过滤器使用
2017/02/08 Javascript
js时间戳格式化成日期格式的多种方法介绍
2017/02/16 Javascript
webpack3+React 的配置全解
2017/08/21 Javascript
聊聊那些使用前端Javascript实现的机器学习类库
2017/09/18 Javascript
React如何利用相对于根目录进行引用组件详解
2017/10/09 Javascript
vue.js 获取select中的value实例
2018/03/01 Javascript
layui表格checkbox选择全选样式及功能的实例
2018/03/07 Javascript
vue+express+jwt持久化登录的方法
2019/06/14 Javascript
vue绑定数字类型 value为数字的实例
2020/08/31 Javascript
[05:00]第二届DOTA2亚洲邀请赛主赛事第三天比赛集锦.mp4
2017/04/04 DOTA
Python中的Classes和Metaclasses详解
2015/04/02 Python
Python之re操作方法(详解)
2017/06/14 Python
django实现前后台交互实例
2017/08/07 Python
pyqt弹出新对话框,以及关闭对话框获取数据的实例
2019/06/18 Python
Django+uni-app实现数据通信中的请求跨域的示例代码
2019/10/12 Python
Scrapy框架实现的登录网站操作示例
2020/02/06 Python
新西兰便宜隐形眼镜购买网站:QUICKLENS New Zealand
2019/03/02 全球购物
吉列剃须刀英国官网:Gillette英国
2019/03/28 全球购物
Schecker荷兰:狗狗用品和配件
2019/06/06 全球购物
敬老文明号事迹材料
2014/01/16 职场文书
入职担保书范文
2014/05/21 职场文书
汉语言文学毕业求职信
2014/07/17 职场文书
婚礼父母致辞
2015/07/28 职场文书
2019年大学毕业生个人自我鉴定范文大全
2019/03/21 职场文书
应用最多的公文《通知》如何写?
2019/04/02 职场文书
2019年入党思想汇报格式与要求
2019/06/25 职场文书