架构师

您现在的位置是:首页 > 程序人生 > 前端别闹

前端别闹

Vue学习笔记之Uncaught (in promise) error问题排查

架构师小跟班 2020-05-22 前端别闹
从字面意思上看,是“未被发现的错误”,我之前一直觉得既然前端已经拿到后端返回的数据了,那一定是前端的代码写的有问题。

报错信息:Uncaught (in promise) error

其实前端已经拿到后端返回的数据了。

vue代码:

JavaScript代码:

后台Java代码:

ConutValue对象很简单,就是从数据库中统计出4个数字。

问题剖析:

从字面意思上看,是“未被发现的错误”,我之前一直觉得既然前端已经拿到后端返回的数据了,那一定是前端的代码写的有问题。但排查了一遍又一遍,仍然没有发现前端代码有什么问题。所以我就比对了下controller层有问题的方法与别的正常的方法有啥区别,一对比,发现还真有:

错误的代码是直接返回了data数据,而加了AjaxResult.success()方法后,

相当于加了个状态码,这样就好了。

AjaxResult.java完整代码:

package com.ryi.rpcs.framework.web.domain;

import java.util.HashMap;
import com.ryi.rpcs.common.constant.HttpStatus;
import com.ryi.rpcs.common.utils.StringUtils;

/**
 * 操作消息提醒
 * 
 * @author https://www.jiagou1216.com
 */
public class AjaxResult extends HashMap<String, Object>
{
    private static final long serialVersionUID = 1L;

    /** 状态码 */
    public static final String CODE_TAG = "code";

    /** 返回内容 */
    public static final String MSG_TAG = "msg";

    /** 数据对象 */
    public static final String DATA_TAG = "data";

    /**
     * 初始化一个新创建的 AjaxResult 对象,使其表示一个空消息。
     */
    public AjaxResult()
    {
    }

    /**
     * 初始化一个新创建的 AjaxResult 对象
     * 
     * @param code 状态码
     * @param msg 返回内容
     */
    public AjaxResult(int code, String msg)
    {
        super.put(CODE_TAG, code);
        super.put(MSG_TAG, msg);
    }

    /**
     * 初始化一个新创建的 AjaxResult 对象
     * 
     * @param code 状态码
     * @param msg 返回内容
     * @param data 数据对象
     */
    public AjaxResult(int code, String msg, Object data)
    {
        super.put(CODE_TAG, code);
        super.put(MSG_TAG, msg);
        if (StringUtils.isNotNull(data))
        {
            super.put(DATA_TAG, data);
        }
    }

    /**
     * 返回成功消息
     * 
     * @return 成功消息
     */
    public static AjaxResult success()
    {
        return AjaxResult.success("操作成功");
    }

    /**
     * 返回成功数据
     * 
     * @return 成功消息
     */
    public static AjaxResult success(Object data)
    {
        return AjaxResult.success("操作成功", data);
    }

    /**
     * 返回成功消息
     * 
     * @param msg 返回内容
     * @return 成功消息
     */
    public static AjaxResult success(String msg)
    {
        return AjaxResult.success(msg, null);
    }

    /**
     * 返回成功消息
     * 
     * @param msg 返回内容
     * @param data 数据对象
     * @return 成功消息
     */
    public static AjaxResult success(String msg, Object data)
    {
        return new AjaxResult(HttpStatus.SUCCESS, msg, data);
    }

    /**
     * 返回错误消息
     * 
     * @return
     */
    public static AjaxResult error()
    {
        return AjaxResult.error("操作失败");
    }

    /**
     * 返回错误消息
     * 
     * @param msg 返回内容
     * @return 警告消息
     */
    public static AjaxResult error(String msg)
    {
        return AjaxResult.error(msg, null);
    }

    /**
     * 返回错误消息
     * 
     * @param msg 返回内容
     * @param data 数据对象
     * @return 警告消息
     */
    public static AjaxResult error(String msg, Object data)
    {
        return new AjaxResult(HttpStatus.ERROR, msg, data);
    }

    /**
     * 返回错误消息
     * 
     * @param code 状态码
     * @param msg 返回内容
     * @return 警告消息
     */
    public static AjaxResult error(int code, String msg)
    {
        return new AjaxResult(code, msg, null);
    }
}




文章评论