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;
                })
            },    

原文地址:https://www.cnblogs.com/lingblog/p/11829177.html

时间: 2024-10-11 07:14:42

Vue axios异步获取后台数据alert提示undefined的相关文章

VUE+axios+php获取后端数据(宝塔面板)

总是听别人说axios好,好在哪里咱也不知道,继上一篇博文还不懂axios,现在稍微可以应用了(暗暗加油!) 看官网教程的时候一直困惑axios里的url到底是什么,很长一个url链接搞的我更迷惑了(其实就是一个PHP文件,读取php文件获得数据而已) vue用axios方法从后端获取数据(感觉确实方便了不少) 附上前端代码 <!DOCTYPE html> <html> <!-- head中引入了element,vue,vue-router,axios --> <

vue中如何获取后台数据

原文链接:http://blog.csdn.net/vergilgeekopen/article/details/68954940 需要引用vue-resource 安装请参考https://github.com/pagekit/vue-resource官方文档 在入口函数中加入 import VueResource from 'vue-resource' Vue.use(VueResource); 在package.json文件中加入 "dependencies": { "

Ajax异步获取html数据中包含js方法无效的解决方法

页面上使用js写了一个获取后台数据的方法 function data() { var tab = $("#dic") $.ajax({ url: '../demo.ashx?method=GetList', data: {}, dataType: 'json', type: 'post', async: true, success: function (data) { //console.log(data); var parentStr = ''; $.each(data, funct

用ajax获取后台数据,返回json数据,怎么在前台使用?

用ajax获取后台数据,返回json数据,怎么在前台使用呢? 后台 C# code ? 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 if (dataType == "SearchCustomer")                 {                     int ID;                     if (Int32.TryParse(CustomerID, out ID))                     {    

jQuery异步获取json数据的2种方式

jQuery异步获取json数据有2种方式,一个是$.getJSON方法,一个是$.ajax方法.本篇体验使用这2种方式异步获取json数据,然后追加到页面. 在根目录下创建data.json文件: { "one" : "Hello", "two" : "World" } ■ 通过$.getJSON方法获取json数据 <script src="Scripts/jquery-2.1.1.min.js"

201507221403_《backbone之一——新建模型和集合、实例化模型、模型上监听事件的方法、模型设置和获取后台数据、配置理由方法、视图绑定事件的方法、绑定模型等》

一 . 新建 var model_1 = new Backbone.Model({'name':'hello'}); var model_2 = new Backbone.Model({'name':'hi'}); var models = new Backbone.Collection(); models.add( model_1 ); models.add( model_2 ); alert( JSON.stringify(models) ); 二. 实例化模型 var M = Backbo

前台通过ajax获取后台数据,PHP如何返回中文数据

现在经常使用Ajax调用后台php获取后台数据,但是PHP返回的数据如果含有中文的话,Ajax会无法识别,那咋整呢,我用的是比较笨的方法,但是实用: echo urldecode(json_encode(array('status'=>'1', 'errMsg'=>urlencode('数据传递错误,请重试')))); return;

获取WebBrowser全cookie 和 httpWebRequest 异步获取页面数据

获取WebBrowser全cookie [DllImport("wininet.dll", CharSet = CharSet.Auto, SetLastError = true)] static extern bool InternetGetCookieEx(string pchURL, string pchCookieName, StringBuilder pchCookieData, ref int pcchCookieData, int dwFlags, object lpRe

sencha touch 通过.axhx获取后台数据时,Unable to parse the JSON returned by the server: Error: You&#39;re trying to

注意:如果你的store跟我一样是使用.ashx从.NET后台获取的,并且用sencha cmd自带的web服务器调试,在chrome调试的时候回会返回如下错误. [WARN][Ext.data.reader.Reader#process] Unable to parse the JSON returned by the server: Error: You're trying to decode an invalid JSON String: <%@ WebHandler Language=&qu