vue接收jsp发送的post请求_Vue.js连接后台数据jsp页面  ̄▽ ̄

本文介绍了如何在Vue.js中接收并处理来自JSP的POST请求,展示两种不同的方法实现数据获取,并展示了后端Action部分的代码。在成功获取数据后,将数据绑定到Vue实例,实现前端页面的数据展示。同时,提到了在Vue.js中更新列表数据的方法以及在SPA应用中处理登录状态的一般过程。
摘要由CSDN通过智能技术生成
Insert title here
id名字性别年龄是否获奖
{{ss.id}}{{ss.userName}}{{ss.sex}}{{ss.age}}{{ss.status}}访问

$.post("userAction_getAllUser",null,function(data){

var vm = new Vue({

el:'#app',

data:data,

timeout:,

success:function(result){

new Vue({

el:'#app',

data:myModel

});

},

error:function(){

alert('咦~出错了!');

}

})

});

/*

//第二种方法

var myModel={userList:[]};

var vm = new Vue({

el:'#app',

data:myModel

});

function getData(){

$.ajax({

url:"userAction_getAllUser",

type:'POST',

dataType:'json',

timeout:3000,

success:function(result){

myModel.userList = result.userList

},

error:function(){

alert('咦~出错了!');

}

});

}

getData();

*/

下面是后台Action的一部分代码

@Autowired

private UserService userService;

public String getAllUser(){

jsonMap = new HashMap();

jsonMap.put("postStatus",);//代表没有异常,成功生成数据

// jsonMap.put("message","恭喜!数据成功生成(给前端工程师看)");

List userList = userService.getAllUser();

jsonMap.put("userList",userList);

return "jsonOK";

}

Struts配置

jsonMap

getAllUser

Atitit vue.js 把ajax数据 绑定到form表单

Atitit vue.js 把ajax数据 绑定到form表单 1.1. 使用场景:主要应用在编辑与提交场合..1 1.2. 绑定数据到form控件,可以使用jquery,不过vue.js更加简单1 ...

Vue.js的列表数据的同步更新方法

这次给大家带来Vue.js的列表数据的同步更新方法,Vue.js列表数据同步更新方法的注意事项有哪些,下面就是实战案例,一起来看一下. 数组的 push(),pop(),shift(),unshift ...

Vue.js实现一个SPA登录页面的过程

技术栈 vue.js 主框架 vuex 状态管理 vue-router 路由管理 一般过程 在一般的登录过程中,一种前端方案是: 检查状态:进入页面时或者路由变化时检查是否有登录状态(保存在cooki ...

Vue.js写一个SPA登录页面的过程

技术栈 vue.js 主框架 vuex 状态管理 vue-router 路由管理 一般过程 在一般的登录过程中,一种前端方案是: 检查状态:进入页面时或者路由变化时检查是否有登录状态(保存在cooki ...

vue项目模拟后台数据

这次我们来模拟一些后台数据,然后去请求它并且将其渲染到界面上.关于项目的搭建鄙人斗胆向大家推荐我的一篇随笔 一.数据建立 我这里为了演示这个过程所以自己编写了 ...

webpack配合vue.js实现完整的单页面demo

本篇文章主要是我在开发前研究了webpack+vue.js的单页面应用,因为需要用到node的npm,所以确保安装了node,建议官网安装最新的稳定版本.并且在项目中需要加载一些npm包,由于npm的 ...

在Vue中由后台数据循环生成多选框CheckBox时的注意事项

多选框是一种非常常见的功能,有时候我们会根据后台返回的数据进行多选框渲染,之前做项目时遇到循环生成多选框时,v-model绑定的值会随着选中与取消改变,但页面却不会变化 的情况,后来测试了一下,发现多 ...

Vue.js学习 Item4 -- 数据双向绑定

Vue.js 的模板是基于 DOM 实现的.这意味着所有的 Vue.js 模板都是可解析的有效的 HTML,且通过一些特殊的特性做了增强.Vue 模板因而从根本上不同于基于字符串的模板,请记住这点. ...

关于vue.js父子组件数据传递

vue.js中使用props down,events up的原则进行父子组件间的通信,先来记录下props down,看个例子:

&lt ...

随机推荐

Magic xpa 2.5发布 Magic xpa 2.5 Release Notes

Magic xpa 2.5發佈 Magic xpa 2.5 Release Notes Magic xpa 2.5 Release NotesNew Features, Feature Enhance ...

最小生成树 kruskal hdu 5723 Abandoned country

题目链接:hdu 5723 Abandoned country 题目大意:N个点,M条边:先构成一棵最小生成树,然后这个最小生成树上求任意两点之间的路径长度和,并求期望 /************** ...

javascript 中寻找性能瓶颈

1.如果一个段代码很耗时的话你可以注释掉一部分你认为是很耗时的,或者干脆全部注释掉,然后再一点一点的解开. 2.js优化中最主要的还是对dom操作的优化,单纯的js执行时间是很短的,而js和dom之间 ...

virtual-虚方法

看来本人理论果然不行啊,这个东西折腾死我了.即便是到现在,还是云里雾里.... 个人认为virtual的特点就是可以被override而不是必需的,到目前为止我用它的地方也比较少. public cl ...

学EE做硬件找工作不如学CS做软件,为什么会这样?

学EE做硬件找工作不如学CS做软件,为什么会这样? 电子工程(EE)就业最好的方向居然是转计算机,也许让有的人觉得很不公平,EE也是很重要的学科,我们学习也很努力,为什么就业会不如CS?也有的人好奇, ...

[LeetCode] Largest Sum of Averages 最大的平均数之和

We partition a row of numbers A into at most K adjacent (non-empty) groups, then our score is the su ...

fiddler查看IP地址和请求响应时间

(一)fiddler查看IP地址 1.点击菜单栏rules——customize rules… 2.ctrl+f搜索“static function main” 3.在main函数里加入下面一行代码, ...

mac 互传文件

搭建HTTP服务,然后局域网访问就行 PHP方式: php -S 172.21.205.xxx:9999 Python python -m SimpleHTTPServer 8001 在浏览器访问:h ...

LA 4287 等价性证明(强连通分量缩点)

https://vjudge.net/problem/UVALive-4287 题意: 给出n个结点m条边的有向图,要求加尽量少的边,使得新图强连通. 思路:强连通分量缩点,然后统计缩点后的图的每个结 ...

sql语句分组/排序/计算总数/连接等sql语句书写

1.什么是表连接? 答:比如两张表,要获取的信息来自两张表,就需要通过外键的形式进行两张表的连接.最后产后组合信息. 表连接是通过join连接的.表连接说白了就是产生一个大表.表连接也都是用于查询上的 ...

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值