Uncaught Invariant Violation: Minified React error #31 问题的一种解决方案

问题描述

    这里是 React 日期选择器组件报的错误,在一个活动列表点击编辑某行记录时控制台打印的错误。

部分错误信息:
Uncaught Invariant Violation: Minified React error #31; visit http://facebook.github.io/react/docs/error-decoder.html?invariant=31&args[]=Tue%20Mar%2031%202020%2023%3A01%3A13%20GMT%2B0800%20(%E4%B8%AD%E5%9B%BD%E6%A0%87%E5%87%86%E6%97%B6%E9%97%B4)&args[]= for the full message or use the non-minified dev environment for full errors and additional helpful warnings.

在这里插入图片描述

问题分析

Uncaught Invariant Violation: Minified React error #31;
未捕获的不变的违规问题,缩小问题排查范围,错误码为 31;

    类似的问题建议根据错误码查看对应的解决方案,此处 ErrorCode 为31,点击访问 Visit 后面的地址,查看报错原因,如下,其实已经给出了问题所在;无效的日期值。那这里和日期有关的就是活动有效期那个日期选择组件,此处是编辑页面,就是拿到数据渲染到日期组件上报错了,日期数据格式不支持,渲染的是无效的日期数据。无效的日期值。

Objects are not valid as a React child (found: Wed Mar 11 2020 23:59:59 GMT+0800 (中国标准时间)).

在这里插入图片描述
    编辑页面可以看到,这里编辑页面日期值"2020-03-29 23:01:13"也渲染成功了,数据前端已经拿到了,就是不满足 React 日期组件要求的数据格式。
    回到前端项目,编辑页面打开弹窗时,初始化动作有对活动有效期格式转换,打个日志跟踪下,可以看到是日期格式处理有误,处理后的日期格式不满足日期组件。
在这里插入图片描述
在这里插入图片描述

问题处理

    方案提示此处的日期对象是无效的,Objects are not valid as a React child (found: Tue Mar 31 2020 23:01:13 GMT+0800 (中国标准时间)),就是编辑动作打开弹窗时对日期数据的格式转换不正确,这里转换为 Date 类型日期组件不支持,后端返回的数据格式就是正确的无需转换; 后端返回数据格式不满足的情况下可以在进行格式转换。moment(model.endTime).format(“YYYY-MM-DD HH:mm:ss”);

Power By niaonao, The End

发布了132 篇原创文章 · 获赞 312 · 访问量 100万+

猜你喜欢

转载自blog.csdn.net/niaonao/article/details/105191632