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 Cookie的读取和写入函数
Dec 08 Javascript
javascript 导出数据到Excel(处理table中的元素)
Dec 18 Javascript
用jQuery获取IE9下拉框默认值问题探讨
Jul 22 Javascript
比较新旧两个数组值得增加和删除的JS代码
Oct 30 Javascript
为JS扩展Array.prototype.indexOf引发的问题及解决办法
Jan 21 Javascript
js实现照片墙功能实例
Feb 05 Javascript
jQuery+ajax读取并解析XML文件的方法
Sep 09 Javascript
微信小程序获取手机系统信息的方法【附源码下载】
Dec 07 Javascript
详解用async/await来处理异步
Aug 28 Javascript
使用vue打包进行云服务器上传的问题
Mar 02 Javascript
js实现淘宝浏览商品放大镜功能
Oct 28 Javascript
js实现纯前端压缩图片
Nov 16 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
初探PHP5
2006/10/09 PHP
PHP中使用mktime获取时间戳的一个黑色幽默分析
2012/05/31 PHP
destoon实现调用当前栏目分类及子分类和三级分类的方法
2014/08/21 PHP
PHP基于关联数组20行代码搞定约瑟夫问题示例
2017/11/07 PHP
javascript算法学习(直接插入排序)
2011/04/12 Javascript
JS Range HTML文档/文字内容选中、库及应用介绍
2011/05/12 Javascript
javascript学习笔记(二十) 获得和设置元素的特性(属性)
2012/06/20 Javascript
jquery选择器之内容过滤选择器详解
2014/01/27 Javascript
js实现漂浮回顶部按钮实例
2015/05/06 Javascript
JS button按钮实现submit按钮提交效果
2016/11/01 Javascript
jQuery Validate 数组 全部验证问题
2017/01/12 Javascript
nodejs中Express与Koa2对比分析
2018/02/06 NodeJs
JavaScript实现图片懒加载的方法分析
2018/07/05 Javascript
vue+iview 实现可编辑表格的示例代码
2018/10/31 Javascript
微信小程序实现九宫格抽奖
2020/04/15 Javascript
Vue使用.sync 实现父子组件的双向绑定数据问题
2019/04/04 Javascript
Nuxt.js的路由跳转操作(页面跳转nuxt-link)
2020/11/06 Javascript
[48:20]OpTic vs Serenity 2018国际邀请赛小组赛BO2 第二场 8.18
2018/08/19 DOTA
在Lighttpd服务器中运行Django应用的方法
2015/07/22 Python
基于Python的接口测试框架实例
2016/11/04 Python
用tensorflow搭建CNN的方法
2018/03/05 Python
在Python 中同一个类两个函数间变量的调用方法
2019/01/31 Python
Python中关于浮点数的冷知识
2019/09/22 Python
CentOS7下安装python3.6.8的教程详解
2020/01/03 Python
pytorch 自定义参数不更新方式
2020/01/06 Python
整理的15个非常有用的 HTML5 开发教程和速查手册
2011/10/18 HTML / CSS
html5的画布canvas——画出弧线、旋转的图形实例代码+效果图
2013/06/09 HTML / CSS
澳大利亚儿童和婴儿产品在线商店:Lime Tree Kids
2017/10/05 全球购物
美国最好的钓鱼、狩猎和划船装备商店:Bass Pro Shops
2018/12/02 全球购物
四风问题查摆材料
2014/08/25 职场文书
"9.18"国耻日演讲稿范文
2014/09/14 职场文书
2015年企业工作总结范文
2015/04/28 职场文书
文明礼仪倡议书
2015/04/28 职场文书
Python实现照片卡通化
2021/12/06 Python
Mysql Innodb存储引擎之索引与算法
2022/02/15 MySQL
Go语言入门exec的基本使用
2022/05/20 Golang