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 相关文章推荐
js字符编码函数区别分析
Jun 05 Javascript
js实现文章文字大小字号功能完整实例
Nov 01 Javascript
js与jquery正则验证电子邮箱、手机号、邮政编码的方法
Jul 04 Javascript
angularJS 如何读写缓冲的方法(推荐)
Aug 06 Javascript
JS实现隐藏同级元素后只显示JS文件内容的方法
Sep 04 Javascript
jQuery+ajax读取并解析XML文件的方法
Sep 09 Javascript
JavaScript中全选、全不选、反选、无刷新删除、批量删除、即点即改入库(在yii框架中操作)的代码分享
Nov 01 Javascript
Bootstrap中data-target 到底是什么
Feb 14 Javascript
Vue.js的复用组件开发流程完整记录
Nov 29 Javascript
ES6 如何改变JS内置行为的代理与反射
Feb 11 Javascript
Vue插件之滑动验证码用法详解
Apr 05 Javascript
解决vue cli4升级sass-loader(v8)后报错问题
Jul 30 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实现的遍历文件夹下所有文件,编辑删除
2010/01/05 PHP
Codeigniter出现错误提示Error with CACHE directory的解决方案
2014/06/12 PHP
php简单的上传类分享
2016/05/15 PHP
php中bind_param()函数用法分析
2017/03/28 PHP
win10下 php安装seaslog扩展的详细步骤
2020/12/04 PHP
javascript 函数调用规则
2009/08/26 Javascript
jQuery中add实现同时选择两个id对象
2010/10/22 Javascript
JavaScript游戏之是男人就下100层代码打包
2010/11/08 Javascript
jquery获取选中的文本和值的方法
2014/07/08 Javascript
js实现简单的左右两边固定广告效果实例
2015/04/10 Javascript
JavaScript取得WEB安全颜色列表的方法
2015/07/14 Javascript
jquery实现红色竖向多级向右展开的导航菜单效果
2015/08/31 Javascript
jQuery实现点击按钮弹出可关闭层的浮动层插件
2015/09/19 Javascript
pace.js页面加载进度条插件
2015/09/29 Javascript
使用contextMenu插件实现Bootstrap table弹出右键菜单
2017/02/20 Javascript
详解Vue 非父子组件通信方法(非Vuex)
2017/05/24 Javascript
在vue中,v-for的索引index在html中的使用方法
2018/03/06 Javascript
js input输入百分号保存数据库失败的解决方法
2018/05/26 Javascript
JavaScript封装的常用工具类库bee.js用法详解【经典类库】
2018/09/03 Javascript
小程序获取周围IBeacon设备的方法
2018/10/31 Javascript
vue 表单之通过v-model绑定单选按钮radio
2019/05/13 Javascript
Vue实现可移动水平时间轴
2020/06/29 Javascript
[04:03]2014DOTA2西雅图国际邀请赛 LGD战队巡礼
2014/07/07 DOTA
[01:01:24]DOTA2上海特级锦标赛A组败者赛 EHOME VS CDEC第三局
2016/02/25 DOTA
Python实现基于KNN算法的笔迹识别功能详解
2018/07/09 Python
浅谈numpy生成数组的零值问题
2018/11/12 Python
python random从集合中随机选择元素的方法
2019/01/23 Python
pycharm中显示CSS提示的知识点总结
2019/07/29 Python
Python 格式化输出_String Formatting_控制小数点位数的实例详解
2020/02/04 Python
基于python实现把json数据转换成Excel表格
2020/05/07 Python
使用python创建Excel工作簿及工作表过程图解
2020/05/27 Python
大专计算机个人求职的自我评价
2013/10/21 职场文书
银行培训心得体会范文
2016/01/09 职场文书
如何书写授权委托书?
2019/06/25 职场文书
Django REST framework 限流功能的使用
2021/06/24 Python
Python 数据可视化工具 Pyecharts 安装及应用
2022/04/20 Python