Reactjs 尝试使用react钩子显示组件

我试图在按下按钮时使用React挂钩显示组件。我确信这是一些简单的语法错误。有什么指导吗

const [displayComponent, setDisplayComponent] = useState(null);

    function sendComponent() {
      setDisplayComponent(
      displayComponent = {<TheImportedComponentIWantToDisplay/>}
      )
    }

    return (

        <Button  onClick={sendComponent} >Push to render component</Button>

        {displayComponent}
)

const[displayComponent，setDisplayComponent]=useState（null）；
函数sendComponent（）{
setDisplayComponent(
displayComponent={}
)
}
返回(
推送渲染组件
{displayComponent}
)

请给出一个答案。但是是的，语法错误（不能将JSX元素放在对象中）、JSX错误（不能像那样返回多个元素，请使用片段）和钩子错误（您没有使用setter）。正如@jornsharpe所说，您有一些错误。这是固定版本：@yaya非常感谢你。根据我自己的理解，我的印象是我必须将displayComponent设置为某个值，因为它是当前值-这就是为什么我将其嵌套并将其设置为我的组件。您的示例工作得很好，但它如何知道displayComponent是什么，因为您刚刚将其设置为setDisplayComponent？我只是想了解原因。谢谢@我不确定我是否明白你的意思，但如果你的意思是：“当我们写：

setDisplayComponent（）

时，

displayComponent

将如何等于：

？”，那么答案是：

setDisplayComponent

是

displayComponent

的setter函数。这意味着它将把

displayComponent

设置为您传递给它的值，并执行一些其他操作（重新渲染组件）。您应该使用setter函数（如：

setDisplayComponent（value）

）来更改功能组件中的状态变量（

displayComponent

）。@yaya这正是我的问题。再次非常感谢你。