Vue axios异步获取后台数据alert提示undefined
Posted 唐桑和歌但
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了Vue axios异步获取后台数据alert提示undefined相关的知识,希望对你有一定的参考价值。
记录一个小问题,关于分页查询套餐
前台通过axios异步请求获取后台数据alert弹出数据提示undefined
下面有三个bean
PageResult
/**
* 分页结果封装对象 */ public class PageResult implements Serializable { //总记录数 private Long total; //当前页结果 private List rows;
//get,set方法省略
....
}
QueryPageBean
/** * 封装查询条件 */ public class QueryPageBean implements Serializable { //页码 private Integer currentPage; //每页记录数 private Integer pageSize; //查询条件 private String queryString; //get,set方法省略
.... }
Result
/** * 封装返回结果 */ public class Result implements Serializable { //执行结果,true为执行成功 false为执行失败 private boolean flag; //返回结果信息,主要用于页面提示信息 private String message; //返回数据 private Object data;
//get,set方法省略
....
}
Controller层
//返回给前台的是一个Result对象 @RequestMapping("/findSetmeal") public Result findSetmeal(@RequestBody QueryPageBean queryPageBean) { try { //service层返回的是一个PageResult对象 PageResult page = setmealService.findPage(queryPageBean); return new Result(true, MessageConstant.QUERY_SETMEALLIST_SUCCESS, page); } catch (Exception e) { return new Result(false, MessageConstant.QUERY_SETMEALLIST_FAIL); } }
前台,获取后台数据alert提示undefined,红色代码为错误示例,由于返回的是一个Result对象,Result对PageResult又进行了封装
//分页查询 findPage() { //设置参数 var param = { currentPage: this.pagination.currentPage, pageSize: this.pagination.pageSize, queryString: this.pagination.queryString, }; axios.post("/setMeal/findPage.do", param).then((response) => { // alert(response.data.flag); // alert(response.data.total); // alert(response.data.rows); this.dataList = response.data.rows; this.pagination.total = response.data.total; this.dataList = response.data.data.rows; this.pagination.total = response.data.data.total; }) },
以上是关于Vue axios异步获取后台数据alert提示undefined的主要内容,如果未能解决你的问题,请参考以下文章
解决Vue axios post请求,后台获取不到数据的问题方法