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 相关文章推荐
在页面上点击任一链接时触发一个事件的代码
Apr 07 Javascript
TimergliderJS 一个基于jQuery的时间轴插件
Dec 07 Javascript
JavaScript Length 属性的总结
Nov 02 Javascript
jquery实现全选和全不选功能效果的实现代码【推荐】
May 05 Javascript
前端程序员必须知道的高性能Javascript知识
Aug 24 Javascript
输入框点击时边框变色效果的实现方法
Dec 26 Javascript
Vue项目全局配置微信分享思路详解
May 04 Javascript
layer.confirm取消按钮绑定事件的方法
Aug 17 Javascript
Node+OCR实现图像文字识别功能
Nov 26 Javascript
elementUi vue el-radio 监听选中变化的实例代码
Jun 28 Javascript
vue中解决拖拽改变存在iframe的div大小时卡顿问题
Jul 22 Javascript
你不知道的SpringBoot与Vue部署解决方案
Nov 09 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一些服务器端特性的配置加强php的安全
2006/10/09 PHP
关于PHP堆栈与列队的学习
2013/06/21 PHP
Yii使用ajax验证显示错误messagebox的解决方法
2014/12/03 PHP
使用PHPExcel导出Excel表
2018/09/08 PHP
Laravel如何同时连接多个数据库详解
2019/08/13 PHP
JavaScript对象之间的转换 jQuery对象和原声DOM
2011/03/07 Javascript
javascript获取所有同类checkbox选项(实例代码)
2013/11/07 Javascript
javascript url几种编码方式详解
2016/06/06 Javascript
JS实现列表的响应式排版(推荐)
2016/09/01 Javascript
在html中引入外部js文件,并调用带参函数的方法
2016/10/31 Javascript
js前端实现多图图片上传预览的两个方法(推荐)
2016/11/18 Javascript
详解nodejs 文本操作模块-fs模块(四)
2016/12/22 NodeJs
AngularJS中ng-class用法实例分析
2017/07/06 Javascript
集合Bootstrap自定义confirm提示效果
2017/09/19 Javascript
详解Javascript 中的 class、构造函数、工厂函数
2017/12/20 Javascript
Angular6 正则表达式允许输入部分中文字符
2018/09/10 Javascript
vue表单验证你真的会了吗?vue表单验证(form)validate
2019/04/07 Javascript
Node配合WebSocket做多文件下载以及进度回传
2019/11/07 Javascript
JS造成内存泄漏的几种情况实例分析
2020/03/02 Javascript
使用Vant完成通知栏Notify的提示操作
2020/11/11 Javascript
用Python制作在地图上模拟瘟疫扩散的Gif图
2015/03/31 Python
numpy中的高维数组转置实例
2018/04/17 Python
解决python大批量读写.doc文件的问题
2018/05/08 Python
Python实现使用request模块下载图片demo示例
2019/05/24 Python
python实现五子棋小程序
2019/06/18 Python
python利用wx实现界面按钮和按钮监听和字体改变的方法
2019/07/17 Python
pytorch1.0中torch.nn.Conv2d用法详解
2020/01/10 Python
详解HTML5 Canvas绘制时指定颜色与透明度的方法
2016/03/25 HTML / CSS
搞笑获奖感言
2014/01/30 职场文书
2014年开学第一课活动方案
2014/03/06 职场文书
民生工程实施方案
2014/03/22 职场文书
行政求职信
2014/07/04 职场文书
法英专业大学生职业生涯规划范文:衡外情,量己力!
2014/09/23 职场文书
初婚未育证明样本
2014/10/24 职场文书
工作年限证明模板
2014/11/01 职场文书
《哪吒之魔童降世》观后感:世上哪有随随便便的成功
2019/11/08 职场文书