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 相关文章推荐
js中几种去掉字串左右空格的方法
Dec 25 Javascript
javascript SocialHistory 检查访问者是否访问过某站点
Aug 02 Javascript
基于jquery的cookie的用法
Jan 10 Javascript
JavaScript移除数组内重复元素的方法
Mar 18 Javascript
JS实现的通用表单验证插件完整实例
Aug 20 Javascript
jQuery实现Flash效果上下翻动的中英文导航菜单代码
Sep 22 Javascript
Json对象和字符串互相转换json数据拼接和JSON使用方式详细介绍(小结)
Oct 25 Javascript
JavaScript实现左侧菜单效果
Dec 14 Javascript
在vue中使用v-bind:class的选项卡方法
Sep 27 Javascript
详解微信小程序支付流程与梳理
Jul 16 Javascript
如何通过JS实现转码与解码
Feb 21 Javascript
JavaScript实现答题评分功能页面
Jun 24 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
javascript数组与php数组的地址传递及值传递用法实例
2015/01/22 PHP
php实现中文转数字
2016/02/18 PHP
解决使用attachEvent函数时,this指向被绑定的元素的问题的方法
2007/08/13 Javascript
Extjs学习笔记之七 布局
2010/01/08 Javascript
javascript 文章截取部分无损html显示实现代码
2010/05/04 Javascript
ExtJS 下拉多选框lovcombo
2010/05/19 Javascript
JQuery AJAX提交中文乱码的解决方案
2010/07/02 Javascript
js怎么终止程序return不行换jfslk
2013/05/30 Javascript
用javascript删除当前行,添加行(示例代码)
2013/11/25 Javascript
Javascript中call的两种用法实例
2013/12/13 Javascript
Jquery实现侧边栏跟随滚动条固定(兼容IE6)
2014/04/02 Javascript
javascript打开word文档的方法
2014/04/16 Javascript
详解JavaScript的AngularJS框架中的作用域与数据绑定
2016/03/04 Javascript
jQuery双向列表选择器DIV模拟版
2016/11/01 Javascript
JS中实现一个下载进度条及播放进度条的代码
2019/06/10 Javascript
分享Angular http interceptors 拦截器使用(推荐)
2019/11/10 Javascript
vue cli3适配所有端方案的实现
2020/04/13 Javascript
vue使用自定义事件的表单输入组件用法详解【日期组件与货币组件】
2020/06/01 Javascript
在Python中操作字典之update()方法的使用
2015/05/22 Python
python开发中module模块用法实例分析
2015/11/12 Python
初学python的操作难点总结(新手必看篇)
2017/08/03 Python
TF-IDF算法解析与Python实现方法详解
2017/11/16 Python
python 获取毫秒数,计算调用时长的方法
2019/02/20 Python
使用python搭建服务器并实现Android端与之通信的方法
2019/06/28 Python
django rest framework 实现用户登录认证详解
2019/07/29 Python
如何基于Python获取图片的物理尺寸
2019/11/25 Python
利于python脚本编写可视化nmap和masscan的方法
2020/12/29 Python
python之随机数函数的实现示例
2020/12/30 Python
使用CSS3来实现滚动视差效果的教程
2015/08/24 HTML / CSS
AmazeUI图片轮播效果的示例代码
2020/08/20 HTML / CSS
2014教育局对照检查材料思想汇报
2014/09/23 职场文书
2014年安置帮教工作总结
2014/12/11 职场文书
实习协议书
2015/01/27 职场文书
2015年大学学生会工作总结
2015/05/13 职场文书
运动会运动员赞词
2015/07/22 职场文书
Java设计模式中的命令模式
2022/04/28 Java/Android