React子(单数)应该是基本数据类型的类型而不是对象，或者它可以是JSX标记(这不是在我们的情况下)。在开发中使用Proptypes包以确保进行验证。

只是一个快速的代码片段(JSX)比较，以代表您的想法:

Error : With object being passed into child <div> {/* item is object with user's name and its other details on it */} {items.map((item, index) => { return <div key={index}> --item object invalid as react child--->>>{item}</div>; })} </div> Without error : With object's property(which should be primitive, i.e. a string value or integer value) being passed into child. <div> {/* item is object with user's name and its other details on it */} {items.map((item, index) => { return <div key={index}> --note the name property is primitive--->{item.name}</div>; })} </div>

TLDR;(来自下面的源代码):确保你在JSX中呈现的所有项都是原语，而不是使用React时的对象。发生此错误通常是因为分派事件的函数被赋予了一个意外的对象类型(即当您应该传递字符串时传递了一个对象)或组件中的JSX部分没有引用原语(即此。Props vs . this.props.name)。

Source - codingbismuth.com

如果您正在使用Firebase并看到此错误，则值得检查是否导入正确。从5.0.4版本开始，你必须像这样导入它:

import firebase from '@firebase/app'
import '@firebase/auth';
import '@firebase/database';
import '@firebase/storage';

是的，我知道。我在这上面也浪费了45分钟。

问题是，当你渲染li时，你是在传递而不是将函数传递给你正在调用它的组件，所以一旦li被渲染，它就会调用它，你需要将引用传递给函数，而不是调用它来做这件事，如果没有参数可以传递，你可以这样写它

onClick={this.onItemClick.bind}

或者像这样，如果有争论要通过

onClick={()=>this.onItemClick.bind(this, item)}

在这种情况下，它将创建一个匿名函数来传递它的引用

多亏了zerkms的评论，我才注意到我的愚蠢错误:

我有onItemClick(e，项目)当我应该有onItemClick(项目，e)。

我在三元运算符中得到了一个错误。 我做了什么:

render(){
  const bar = <div>asdfasdf</div>
  return ({this.state.foo ? {bar} : <div>blahblah</div>})
}

结果是它应该是没有括号的bar，比如:

render(){
  const bar = <div>asdfasdf</div>
  return ({this.state.foo ? bar : <div>blahblah</div>})
}

我得到这个错误每当我在我的FlatList的renderItem函数上调用async。

在调用FlatList中的状态数据之前，我必须创建一个新函数来将我的Firestore集合设置为我的状态。