如何将 React Hook 传递给子组件答案

【问题标题】：How to pass a React Hook to a child component如何将 React Hook 传递给子组件
【发布时间】：2019-11-14 15:35:57
【问题描述】：

我想将 React Hook 的 setter 传递给子组件。这样子组件中的按钮通过保存在父组件中的 setter 更新状态。我尝试了以下设置，但收到一条错误消息：

TypeError: setshowOptionPC 不是函数点击

我的方法是否可行？如果不是，我怎么可能使用 React Hook 来实现这种结构。

下面是我的代码的简化版本：

import React, { useState } from "react";

function ChildComponent({ setshowChildOptionBC, setshowChildOptionPC }) (
  <div>
    <button
      onClick={() => {
        setshowChildOptionPC(false);
        setshowChildOptionBC(true);
      }}
    >
      BC
    </button>
    <button
      onClick={() => {
        setshowChildOptionPC(true);
        setshowChildOptionBC(false);
      }}
    >
      PC
    </button>
  </div>
);


function ParentComponent() {
  const [showOptionBC, setshowOptionBC] = useState(true);
  const [showOptionPC, setshowOptionPC] = useState(false);

  return (
    <div>
      <ChildComponent
        setshowChildOptionBC={setshowOptionBC}
        setshowChildOptionPC={setshowOptionPC}
      />
      {showOptionBC && <div>BC</div>}
      {showOptionPC && <div>PC</div>}
    </div>
  );
}

export default ParentComponent;

【问题讨论】：

function ChildComponent({ setshowOptionBC, setshowOptionPC }) 你少了大括号

标签： javascript reactjs

【解决方案1】：

我认为您只是忘记在子组件中解构道具。这可能会有所帮助。

function ChildComponent({setshowOptionBC, setshowOptionPC}) {..

【讨论】：