javascript - React中的条件渲染无法正常工作，状态不能正常工作吗？

我试图只在使用搜索按钮时才渲染组件。

下面的代码是我当前的代码

更新

进行了更改，
现在收到此错误。

错误]/home/holborn/Documents/Work/Portfolio/Data_Scraping/Eldritch/client/pages/index.tsx(21,19)中的错误:
21:19找不到名称“产品”。
19 |接口(interface)OutputProps {
20 |搜索？:字符串



搜索时这是产品列表的数组

在遵循其他问题后，我得到此错误。

JSX element type 'void' is not a constructor function for JSX elements.
    262 |
    263 |   return (
  > 264 |     <Output columns={columns} message={message} handleSearch={handleSearch} searchRef={searchRef} productList={productList}/>
        |     ^
    265 |
    266 |   );
    267 | }

最佳答案

您希望输出组件具有productList和searched作为 Prop ，但是您将data作为 Prop 传递

其次，您必须直接定义接口(interface)，而不是将其定义为函数

 interface OutputProps {
    searched?: string
    productList?: Product[]
}

...


<Output searched={searched} productList={productList}/>

关于javascript - React中的条件渲染无法正常工作，状态不能正常工作吗？，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/61912406/