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控制页面链接在新窗口打开具体方法
Aug 16 Javascript
jQuery控制TR显示隐藏的三种常用方法
Aug 21 Javascript
个人网站留言页面(前端jQuery编写、后台php读写MySQL)
May 03 Javascript
详解Angular2 之 结构型指令
Jun 21 Javascript
vue实现点击当前标签高亮效果【推荐】
Jun 22 Javascript
vuejs router history 配置到iis的方法
Sep 20 Javascript
通过npm或yarn自动生成vue组件的方法示例
Feb 12 Javascript
Ajax请求时无法重定向的问题解决代码详解
Jun 21 Javascript
JavaScript展开操作符(Spread operator)详解
Jul 20 Javascript
vue.js实现数据库的JSON数据输出渲染到html页面功能示例
Aug 03 Javascript
原生js实现日期选择插件
May 21 Javascript
JavaScript实现移动端拖动元素
Nov 24 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
ECMall支持SSL连接邮件服务器的配置方法详解
2014/05/19 PHP
PHP操作Postgresql封装类与应用完整实例
2018/04/24 PHP
Js 获取当前日期时间及其它操作实现代码
2021/03/04 Javascript
jQuery中siblings()方法用法实例
2015/01/08 Javascript
jQuery simplePage+AJAX plus分页插件用法实例
2016/02/17 Javascript
Bootstrap教程JS插件弹出框学习笔记分享
2016/05/17 Javascript
Js 获取当前函数参数对象的实现代码
2016/06/20 Javascript
jQuery仿京东商城楼梯式导航定位菜单
2016/07/25 Javascript
jQuery事件对象总结
2016/10/17 Javascript
Angular2使用Angular CLI快速搭建工程(一)
2017/05/21 Javascript
使用Vue写一个datepicker的示例
2018/01/27 Javascript
一个Vue页面的内存泄露分析详解
2018/06/25 Javascript
layui问题之模拟select点击事件的实例讲解
2018/08/15 Javascript
React 项目迁移 Webpack Babel7的实现
2018/09/12 Javascript
vue中多路由表头吸顶实现的几种布局方式
2019/04/12 Javascript
ES6入门教程之let、const的使用方法
2019/04/13 Javascript
JavaScript中作用域链的概念及用途讲解
2020/08/06 Javascript
[01:11:08]Winstrike vs NB 2018国际邀请赛淘汰赛BO1 8.21
2018/08/22 DOTA
[46:21]Liquid vs LGD 2018国际邀请赛淘汰赛BO3 第一场 8.23
2018/08/24 DOTA
python list 合并连接字符串的方法
2013/03/09 Python
用Python代码来绘制彭罗斯点阵的教程
2015/04/03 Python
Python 常用模块 re 使用方法详解
2019/06/06 Python
使用python实现ftp的文件读写方法
2019/07/02 Python
画pytorch模型图,以及参数计算的方法
2019/08/17 Python
python爬取Ajax动态加载网页过程解析
2019/09/05 Python
在vscode中配置python环境过程解析
2019/09/28 Python
python3定位并识别图片验证码实现自动登录功能
2021/01/29 Python
html5 viewport使用方法示例详解
2013/12/02 HTML / CSS
2014年安全生产责任书
2014/07/22 职场文书
2015年体检中心工作总结
2015/05/27 职场文书
篮球比赛通讯稿
2015/07/18 职场文书
机械生产实习心得体会
2016/01/22 职场文书
《法国号》教学反思
2016/02/22 职场文书
vue-router中hash模式与history模式的区别
2021/06/23 Vue.js
golang内置函数len的小技巧
2021/07/25 Golang
vue的项目如何打包上线
2022/04/13 Vue.js