Vue请求java服务端并返回数据代码实例


Posted in Javascript onNovember 28, 2019

这篇文章主要介绍了Vue请求java服务端并返回数据代码实例,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下

最近在自学vue怎么与java进行数据交互。其实axios还是挺简单的,与ajax请求几乎一样,无外乎也就是要解决下跨域的问题。

废话不多说了,直接贴代码,一看就懂!

//向springmvc Controller发起请求,传递一个参数
get请求(带参数传递)
axios.get('http://127.0.0.1:8088/inas/f/demo/test?name=2222')
.then(function (response) {
console.log(response);

var data = response.data;
alert(data[0].conpany);
})
.catch(function (error) {
console.log(error);
});

后台代码:

@ResponseBody
@RequestMapping(value="/test",method=RequestMethod.GET)
public String test(@RequestParam String name,HttpServletResponse response) {

List<Object> list = new ArrayList<Object>();
Map<String,Object> userMap1 = new HashMap<String, Object>();
Map<String,Object> userMap2 = new HashMap<String, Object>();

userMap1.put("conpany", "河南电力");
userMap1.put("section", "郑州分公司");
userMap1.put("admin", "123123");
userMap1.put("name", "张华凤");
userMap1.put("tel", "954127004");
userMap1.put("phone", "15056993012");

list.add(userMap1);
String jsonStr = JSON.toJSON(list).toString();
response.setHeader("Access-Control-Allow-Origin", "*");
return jsonStr;
}

此时可以在浏览器中看到服务器返回给我们的数据:

Vue请求java服务端并返回数据代码实例

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
JQuery实现表格动态增加行并对新行添加事件
Jul 30 Javascript
js实现点击添加一个input节点
Dec 05 Javascript
JavaScript中使用数组方法汇总
Feb 16 Javascript
分享vue.js devtools遇到一系列问题
Oct 24 Javascript
微信小程序实现的贪吃蛇游戏【附源码下载】
Jan 03 Javascript
Node.js文件编码格式的转换的方法
Apr 27 Javascript
微信小程序实现动态显示和隐藏某个控件功能示例
Dec 14 Javascript
如何为vue的项目添加单元测试
Dec 19 Javascript
ES6 Iterator遍历器原理,应用场景及相关常用知识拓展详解
Feb 15 Javascript
Vue自定义组件的四种方式示例详解
Feb 28 Javascript
jQuery+Ajax+js实现请求json格式数据并渲染到html页面操作示例
Jun 02 jQuery
js实现圆形菜单选择器
Dec 03 Javascript
javascript实现异形滚动轮播
Nov 28 #Javascript
javascript实现切割轮播效果
Nov 28 #Javascript
javascript实现商品图片放大镜
Nov 28 #Javascript
javascript实现视频弹幕效果(两个版本)
Nov 28 #Javascript
javascript实现弹幕墙效果
Nov 28 #Javascript
jquery实现直播弹幕效果
Nov 28 #jQuery
jQuery实现简单弹幕效果
Nov 28 #jQuery
You might like
PHP去掉从word直接粘贴过来的没有用格式的函数
2012/10/29 PHP
php单例模式示例分享
2015/02/12 PHP
php实现简单的上传进度条
2015/11/17 PHP
PHP程序员的技术成长规划
2016/03/25 PHP
PHP数据库表操作的封装类及用法实例详解
2016/07/12 PHP
Yii框架 session 数据库存储操作方法示例
2019/11/18 PHP
发一个自己用JS写的实用看图工具实现代码
2008/07/26 Javascript
Javascript 遍历对象中的子对象
2009/07/03 Javascript
再论Javascript的类继承
2011/03/05 Javascript
js数组的操作详解
2013/03/27 Javascript
js原生appendChild的bug解决心得分享
2013/07/01 Javascript
JS对象转换为Jquery对象示例
2014/01/26 Javascript
JavaScript点击按钮后弹出透明浮动层的方法
2015/05/11 Javascript
详解JavaScript中数组的相关知识
2015/07/29 Javascript
jQuery实现简单下拉导航效果
2015/09/07 Javascript
js实现动态加载脚本的方法实例汇总
2015/11/02 Javascript
浅谈js的url解析函数封装
2016/06/28 Javascript
JS给swf传参数的实现方法
2016/09/13 Javascript
BootStrap 弹出层代码
2017/02/09 Javascript
javascript ES6中箭头函数注意细节小结
2017/02/17 Javascript
Angular.js中定时器循环的3种方法总结
2017/04/27 Javascript
VUE预渲染及遇到的坑
2018/09/03 Javascript
layui select 禁止点击的实现方法
2019/09/05 Javascript
微信小程序(订阅消息)功能
2019/10/25 Javascript
[01:55]《走出家门看比赛》——DOTA2 2015国际邀请赛同城线下观战
2015/07/18 DOTA
简单了解python filter、map、reduce的区别
2020/01/14 Python
python GUI库图形界面开发之PyQt5简单绘图板实例与代码分析
2020/03/08 Python
Python如何进行时间处理
2020/08/06 Python
Python变量格式化输出实现原理解析
2020/08/06 Python
css3动画过渡实现鼠标跟随导航效果
2018/02/08 HTML / CSS
C#面试题问题集
2016/04/02 面试题
应届生财务会计求职信
2013/11/05 职场文书
中餐厅经理岗位职责
2014/04/11 职场文书
新党章的学习心得体会
2014/11/07 职场文书
一年级数学上册复习计划
2015/01/17 职场文书
ICOM R71E和R72E图文对比解说
2022/04/07 无线电