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 相关文章推荐
jQuery 动画基础教程
Dec 25 Javascript
Array.prototype.slice.apply的使用方法
Mar 17 Javascript
ajax在兼容模式下失效的快速解决方法
Mar 22 Javascript
DOM中事件处理概览与原理的全面解析
Aug 16 Javascript
Javascript函数中的arguments.callee用法实例分析
Sep 16 Javascript
JS+Canvas绘制动态时钟效果
Nov 10 Javascript
vue实现验证码输入框组件
Dec 14 Javascript
vue2.0之多页面的开发的示例
Jan 30 Javascript
Angular学习笔记之集成三方UI框架、控件的示例
Mar 23 Javascript
JS实现随机生成10个手机号的方法示例
Dec 07 Javascript
js函数柯里化的方法和作用实例分析
Apr 11 Javascript
如何在Express4.x中愉快地使用async的方法
Nov 18 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页面消耗内存过大的处理办法
2013/03/18 PHP
学习php开源项目的源码指南
2014/12/21 PHP
PHP常用处理静态操作类
2015/04/03 PHP
php简单随机字符串生成方法示例
2017/04/19 PHP
js,jQuery 排序的实现代码,网页标签排序的实现,标签排序
2011/04/27 Javascript
JQuery与JS里submit()的区别示例介绍
2014/02/17 Javascript
node.js中的console.time方法使用说明
2014/12/09 Javascript
jQuery中siblings()方法用法实例
2015/01/08 Javascript
jQuery中extend函数详解
2015/02/13 Javascript
详细分析JavaScript函数定义
2015/07/16 Javascript
jQuery实现模仿微博下拉滚动条加载数据效果
2015/12/25 Javascript
Vue.js每天必学之过滤器与自定义过滤器
2016/09/07 Javascript
jquery.validate表单验证插件使用方法解析
2016/11/07 Javascript
根据Bootstrap Paginator改写的js分页插件
2016/12/25 Javascript
javascript中apply/call和bind的使用
2017/02/15 Javascript
Nodejs之TCP服务端与客户端聊天程序详解
2017/07/07 NodeJs
vue2.0在没有dev-server.js下的本地数据配置方法
2018/02/23 Javascript
VueJS 组件参数名命名与组件属性转化问题
2018/12/03 Javascript
JS数组push、unshift、pop、shift方法的实现与使用方法示例
2020/04/29 Javascript
详解JavaScript作用域、作用域链和闭包的用法
2020/09/03 Javascript
[02:53]DOTA2英雄昆卡基础教程
2013/11/25 DOTA
[45:59]完美世界DOTA2联赛PWL S2 FTD vs GXR 第二场 11.22
2020/11/24 DOTA
python返回昨天日期的方法
2015/05/13 Python
详解Python使用tensorflow入门指南
2018/02/09 Python
Python列表原理与用法详解【创建、元素增加、删除、访问、计数、切片、遍历等】
2019/10/30 Python
使用Python和OpenCV检测图像中的物体并将物体裁剪下来
2019/10/30 Python
python实现多进程按序号批量修改文件名的方法示例
2019/12/30 Python
解决Jupyter NoteBook输出的图表太小看不清问题
2020/04/16 Python
python中adb有什么功能
2020/06/07 Python
Python 随机按键模拟2小时
2020/12/30 Python
CSS3使用transition实现的鼠标悬停淡入淡出
2015/01/09 HTML / CSS
社区党员公开承诺书
2014/08/30 职场文书
初三学生语文考试作弊检讨书
2014/12/14 职场文书
幼儿园开学通知
2015/04/24 职场文书
python自动化之如何利用allure生成测试报告
2021/05/02 Python
python unittest单元测试的步骤分析
2021/08/02 Python