Javascript 如何使用React.memo（）正确包装功能组件？仍然在父组件的每个重新渲染器上重新渲染

缩短代码以使其更具可读性

在components/FunctionalComponent.js中：

import React, {memo} from 'react'
//other necessary imports...

const FunctionalComponent = ({destructuredProps}) => {
   ...
   //some code that determines what and how the component behaves. Uses destructured props.
   ...
   return (
   <View>
      ...
      A lot of other elements
      ...
   </View>
   )
}

export default memo(FunctionalComponent);

搜索词和setter被传递给组件，因为我需要API请求的信息。传递details setter是因为我希望访问和显示搜索栏中API调用返回的部分信息

---

希望这能让事情变得更清楚。

如果该组件仍然被重新招标，那么它的一个道具正在改变。因为你没有提供一个完整的例子，这就是我们所能说的。你能告诉我们你是如何调用

useCallback

？@azium我已经更新了这篇文章，在“编辑”部分有更多的信息。希望这能让事情更容易回答。谢谢你的回复@FelixKling据我所知，当您将从useCallback返回的函数传递给组件时，当

React.memo

检查道具是否已更改时，它应等同于“equal”。我在文章的“编辑”部分添加了一些更改以获取更多信息。对我来说似乎没问题，但请注意“React保证setState函数标识是稳定的，并且在重新呈现时不会更改。”（）因此，如果您仅为状态设置器使用

useCallback

，那么您实际上并不需要它们。

import React from 'react'
import FunctionalComponent from 'components/FunctionalComponent'

const MainComponent = () => {
   //some code that determines how component behaves
   return (
   <View>
      //Some other components
      <FunctionalComponent />
   </View>
   )
}

export default MainComponent