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 相关文章推荐
个人总结的一些关于String、Function、Array的属性和用法
Jan 10 Javascript
Javascript浅谈之this
Dec 17 Javascript
js中replace的用法总结
Dec 27 Javascript
为指定的元素添加遮罩层的示例代码
Jan 15 Javascript
IE下双击checkbox反应延迟问题的解决方法
Mar 27 Javascript
使用AngularJS实现表单向导的方法
Jun 19 Javascript
angularjs学习笔记之双向数据绑定
Sep 26 Javascript
js代码实现点击按钮出现60秒倒计时
Jan 28 Javascript
javascript学习笔记_浅谈基础语法,类型,变量
Sep 19 Javascript
基于vue-cli配置lib-flexible + rem实现移动端自适应
Dec 26 Javascript
jquery实现Ajax请求的几种常见方式总结
May 28 jQuery
详解JavaScript中Arguments对象用途
Aug 30 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中使用XML
2006/10/09 PHP
将FCKeditor导入PHP+SMARTY的实现方法
2015/01/15 PHP
mod_php、FastCGI、PHP-FPM等PHP运行方式对比
2015/07/02 PHP
浅谈PHP值mysql操作类
2016/06/29 PHP
解决laravel上传图片之后,目录有图片,但是访问不到(404)的问题
2019/10/14 PHP
ajax 同步请求和异步请求的差异分析
2011/07/04 Javascript
JavaScript的Module模式编程深入分析
2013/08/13 Javascript
js switch case default 的用法示例介绍
2013/10/23 Javascript
jquery validate添加自定义验证规则(验证邮箱 邮政编码)
2013/12/04 Javascript
js检测浏览器版本、核心、是否移动端示例
2014/04/24 Javascript
使用JSON.parse将json字符串转换成json对象的时候会出错
2014/09/04 Javascript
jquery实现带缩略图的全屏图片画廊效果实例
2015/06/25 Javascript
使用jquery.qrcode.js生成二维码插件
2016/10/17 Javascript
JavaScript Date 知识浅析
2017/01/29 Javascript
vue滚动轴插件better-scroll使用详解
2017/10/17 Javascript
基于elementUI实现图片预览组件的示例代码
2019/03/31 Javascript
详解vue-cli中使用rem,vue自适应
2019/05/06 Javascript
JavaScript实现手机号码 3-4-4格式并控制新增和删除时光标的位置
2020/06/02 Javascript
vue3 watch和watchEffect的使用以及有哪些区别
2021/01/26 Vue.js
Python2.x中str与unicode相关问题的解决方法
2015/03/30 Python
Python3.2中的字符串函数学习总结
2015/04/23 Python
用Python的Tornado框架结合memcached页面改善博客性能
2015/04/24 Python
python基于BeautifulSoup实现抓取网页指定内容的方法
2015/07/09 Python
使用Python发送各种形式的邮件的方法汇总
2015/11/09 Python
python操作oracle的完整教程分享
2018/01/30 Python
django自带调试服务器的使用详解
2019/08/29 Python
Python之数据序列化(json、pickle、shelve)详解
2019/08/30 Python
python 实现提取log文件中的关键句子,并进行统计分析
2019/12/24 Python
师德师风承诺书
2014/05/23 职场文书
农村文化建设标语
2014/10/07 职场文书
门面房租房协议书
2014/12/01 职场文书
2015年护士医德医风自我评价
2015/03/03 职场文书
东京审判观后感
2015/06/01 职场文书
2016年推广普通话宣传周活动总结
2016/04/06 职场文书
Canvas跟随鼠标炫彩小球的实现
2021/04/11 Javascript
浅谈如何保证Mysql主从一致
2022/03/13 MySQL