zoukankan      html  css  js  c++  java
  • 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;
                    })
                },    
  • 相关阅读:
    Spring Boot & ES 实战,值得参考!
    什么是 Java 对象深拷贝?面试必问!
    一份完整的 MySQL 开发规范,进大厂必看!
    ASP.NET + MVC5 入门完整教程五 --- Razor (模型与布局)
    C# MVC扩展方法
    C#泛型应用及原理
    部分类及部分方法
    程序集
    类的可访问属性
    ASP.NET + MVC5 入门完整教程四---MVC 中使用扩展方法
  • 原文地址:https://www.cnblogs.com/lingblog/p/11829177.html
Copyright © 2011-2022 走看看