React Error: Invalid React Child
当 render 方法尝试渲染无效的 React child 时,会发生此错误,返回时可能会发生这种情况数组或对象而不是有效的 React 元素。
在您的情况下,错误是由于直接在地图函数中引用绑定方法 this.onItemClick.bind(this, item) 引起的。要修复此问题,您应该使用箭头函数:
<code class="javascript">render() { const items = ['EN', 'IT', 'FR', 'GR', 'RU'].map((item) => { return (<li onClick={(e) => this.onItemClick(e, item)} key={item}>{item}</li>); }); // ... }</code>
箭头函数创建一个新作用域,其中 this 值绑定到组件实例,允许您访问 onItemClick 函数。
理解错误消息
错误消息包含以下信息:
附加说明
<code class="javascript">onClick={(e) => this.setState((prevState) => ({ lang: item }))}</code>
以上是在'render”方法中映射数组时,为什么会收到'Invalid React Child”错误?的详细内容。更多信息请关注PHP中文网其他相关文章!