gpt4 book ai didi

javascript - 对象作为 React.memo 的 React 子项无效

转载 作者:行者123 更新时间:2023-12-05 03:48:23 26 4
gpt4 key购买 nike

我收到以下错误

Warning: memo: The first argument must be a component. Instead received: object

Uncaught Error: Objects are not valid as a React child (found: object with keys {$$typeof, type, compare}). If you meant to render a collection of children, use an array instead.

当我更改此组件时它们会发生

const Tab = () => onLastTab 
? <AccountTab data={data.account} />
: <InfoTab data={data.info} />

要成为这个组件,唯一的区别就是使用了React.memo

const Tab = () => onLastTab 
? React.memo(<TabOne data={data.one} />)
: React.memo(<TabTwo data={data.two} />)

那些包裹在 React.memo 中的组件肯定只是看起来像的功能组件

const TabOne = ({data}) => (
<div>
<div className='d-flex '>
...
</div>
</div>
)

为什么会这样?我能做些什么来阻止它?

最佳答案

正如错误消息所解释的那样,您需要将组件而不是对象传递给 React.memo()。 TabOne 显然是一个组件名称,但您已经创建了该组件的对象并将其传递给 React.memo()。您需要按如下方式修复您的代码:

const TabOne = ({data}) => (
<div>
<div className='d-flex '>
...
</div>
</div>
)
export default React.memo(TabOne)
const Tab = () => onLastTab 
? <TabOne data={data.one} />
: <TabTwo data={data.two} />

关于javascript - 对象作为 React.memo 的 React 子项无效,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/64433427/

26 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com