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入门学习资料收集整理篇
Jul 06 Javascript
文本框的字数限制功能jquery插件
Nov 24 Javascript
Extjs显示从数据库取出时间转换JSON后的出现问题
Nov 20 Javascript
jQuery判断iframe中元素是否存在的方法
May 11 Javascript
xmlhttp缓存清除的2种解决方法
Dec 13 Javascript
IE中JS跳转丢失referrer问题的2个解决方法
Jul 18 Javascript
Jquery遍历select option和添加移除option的实现方法
Aug 26 Javascript
js原生跨域_用script标签的简单实现
Sep 24 Javascript
Node.js学习入门
Jan 03 Javascript
jQuery实现页码跳转式动态数据分页
Dec 31 jQuery
详解Vue中使用插槽(slot)、聚类插槽
Apr 12 Javascript
解决antd datepicker 获取时间默认少8个小时的问题
Oct 29 Javascript
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入门学习知识点八 PHP中for循环基本应用之九九乘法口绝表
2011/07/14 PHP
PHP实现GIF图片验证码
2015/11/04 PHP
PHP常用的类封装小结【4个工具类】
2019/06/28 PHP
javascript之dhDataGrid Ver2.0.0代码
2007/07/01 Javascript
javascript 兼容FF的onmouseenter和onmouseleave的代码
2008/07/19 Javascript
ext实现完整的登录代码
2008/08/08 Javascript
编写可维护面向对象的JavaScript代码[翻译]
2011/02/12 Javascript
EXTjs4.0的store的findRecord的BUG演示代码
2013/06/08 Javascript
将list转换为json失败的原因
2013/12/17 Javascript
window.onload追加函数使用示例
2014/03/03 Javascript
AngularJS语法详解
2015/01/23 Javascript
AngularJs 动态加载模块和依赖
2016/09/15 Javascript
Bootstrap媒体对象学习使用
2017/03/07 Javascript
Angular.js中$resource高大上的数据交互详解
2017/07/30 Javascript
新年快乐! javascript实现超级炫酷的3D烟花特效
2019/01/30 Javascript
node.js中npm包管理工具用法分析
2020/02/14 Javascript
antd配置config-overrides.js文件的操作
2020/10/31 Javascript
python 开发的三种运行模式详细介绍
2017/01/18 Python
Python 自动刷博客浏览量实例代码
2017/06/14 Python
Django 生成登陆验证码代码分享
2017/12/12 Python
python自动12306抢票软件实现代码
2018/02/24 Python
python编写弹球游戏的实现代码
2018/03/12 Python
在Python 不同级目录之间模块的调用方法
2019/01/19 Python
Python把对应格式的csv文件转换成字典类型存储脚本的方法
2019/02/12 Python
django 单表操作实例详解
2019/07/30 Python
Python调用接口合并Excel表代码实例
2020/03/31 Python
python 怎样进行内存管理
2020/11/10 Python
HTML5 语音搜索只需一句代码
2013/01/03 HTML / CSS
html5 拖拽及用 js 实现拖拽功能的示例代码
2020/10/23 HTML / CSS
YSL圣罗兰美妆俄罗斯官网:Yves Saint Lauret RU
2020/09/23 全球购物
计算机科学与技术应届生求职信
2013/11/07 职场文书
上班玩手机检讨书
2014/02/17 职场文书
证券公司客户经理岗位职责
2015/04/09 职场文书
教师节祝酒词
2015/08/11 职场文书
文明上网主题班会
2015/08/14 职场文书
Tomcat执行startup.bat出现闪退的原因及解决办法
2022/04/20 Servers