一、报错信息
Uncaught Error: Objects are not valid as a React child (found: object with keys {content, key, duration}). If you meant to render a collection of children, use an array instead.
意思是:未捕获错误:对象作为React子对象无效(找到:具有键{content,key,duration}的对象)。如果要呈现子对象集合,请改用数组。
什么原因导致的:
主要是在render函数里直接渲染一个对象造成的 。 react里 数组和字符串可以直接渲染,唯独对象不可以。
下面的例子里
obj是一个对象 里面有a 属性,而我 直接在 render 里 渲染了 obj 。正确 应该是 obj.a才对 ,react里要渲染对象 必须是 对象.属性形式(obj.key、obj[key]) 。或者你 遍历也行。
class Index extends Component {
constructor(props) {
super(props);
}
componentDidMount() {
}
render() {
let obj={ //一个对象 直接渲染就会出现
a:"00"
}
return (
<div>
{obj}
</div>
)
}
}
我的问题是表格里columns 里,message是一个对象(后端返回的 数据 message不是字符串也不是数组 是一个 对象形式,react里 数组和字符串可以直接渲染,唯独对象不可以),所以会报错
[
{
title:"rr",
dataIndex:"message",
align:"center"
}
]
造成这个错误的可能 不止这种情形 ,也可能其它原因,我遇到的是这种情形。
补充:react里 数组可以直接 渲染 只不过 它会显示成一个字符串形式
例如:
class Index extends Component {
state = {
};
componentDidMount() {
}
render() {
let a=[1,3,4];
let a1=["我","爱","你"];
return (
<div>
<p>{a}</p>
<p>{a1}</p>
</div>
)
}
}
效果如下:
二、解决方案:
避免直接渲染Object 类型的数据 。
比如上面的得obj.a才行