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  THIS详解 面向对象
Mar 25 Javascript
获取dom元素那些讨厌的位置封装代码
Jun 23 Javascript
js页面跳转常用的几种方式
Nov 25 Javascript
基于jquery的分页控件(C#)
Jan 06 Javascript
DOM和XMLHttpRequest对象的属性和方法整理
Jan 04 Javascript
Angularjs基础知识及示例汇总
Jan 22 Javascript
jQuery获得指定元素坐标的方法
Apr 14 Javascript
JavaScript实现Iterator模式实例分析
Jun 09 Javascript
JS实现环形进度条(从0到100%)效果
Jul 05 Javascript
jQuery查找节点并获取节点属性的方法
Sep 09 Javascript
jQuery获取单选按钮radio选中值与去除所有radio选中状态的方法
May 20 jQuery
基于webpack 实用配置方法总结
Sep 28 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检测用户语言的方法
2015/06/15 PHP
PHP实现根据密码长度显示安全条
2017/07/04 PHP
PHP下用Swoole实现Actor并发模型的方法
2019/06/12 PHP
Windows服务器中PHP如何安装redis扩展
2019/09/27 PHP
javascript内存管理详细解析
2013/11/11 Javascript
firefox下jquery ajax返回object XMLDocument处理方法
2014/01/26 Javascript
使用POST方式弹出窗口的两种方法示例介绍
2014/01/29 Javascript
node.js中的http.response.write方法使用说明
2014/12/14 Javascript
分享两个手机访问pc网站自动跳转手机端网站代码
2020/12/24 Javascript
js实现仿QQ秀换装效果的方法
2015/03/04 Javascript
7个jQuery最佳实践
2016/01/12 Javascript
js 中获取制定的cook信息实现方法
2016/11/19 Javascript
Webpack实现按需打包Lodash的几种方法详解
2017/05/08 Javascript
js设计模式之单例模式原理与用法详解
2019/08/15 Javascript
[56:01]2018DOTA2亚洲邀请赛 3.31 小组赛 B组 Effect vs EG
2018/03/31 DOTA
[10:28]2018DOTA2国际邀请赛寻真——VGJ.S寻梦之路
2018/08/15 DOTA
Python计算三角函数之asin()方法的使用
2015/05/15 Python
Unicode和Python的中文处理
2017/03/19 Python
python skimage 连通性区域检测方法
2018/06/21 Python
python得到一个excel的全部sheet标签值方法
2018/12/10 Python
Python3爬虫教程之利用Python实现发送天气预报邮件
2018/12/16 Python
解决Python中定时任务线程无法自动退出的问题
2019/02/18 Python
GitHub 热门:Python 算法大全,Star 超过 2 万
2019/04/29 Python
python小程序基于Jupyter实现天气查询的方法
2020/03/27 Python
html5需遵循的6个设计原则
2016/04/27 HTML / CSS
英国版MAC彩妆品牌:Illamasqua
2018/04/18 全球购物
英国在线定制百叶窗网站:Swift Direct Blinds
2020/02/25 全球购物
心得体会范文
2014/01/04 职场文书
教师敬业奉献模范事迹材料
2014/05/18 职场文书
乔布斯斯坦福大学演讲稿
2014/05/23 职场文书
2014年加油站工作总结
2014/12/04 职场文书
前台接待岗位职责
2015/02/03 职场文书
网站文案策划岗位职责
2015/04/14 职场文书
Python insert() / append() 用法 Leetcode实战演示
2021/03/31 Python
教你怎么用Python监控愉客行车程
2021/04/29 Python
go语言基础 seek光标位置os包的使用
2021/05/09 Golang