React：通過布局組件傳遞道具

Question

這里是 React 的新手，我想要一個過濾器（在 Nav.js 中）過濾 App.js 上的內容，但嵌套在 Layout 組件中。 在這里傳遞道具的最佳方式是什么？ 我可以將所有內容都保留為功能組件嗎？

此處的文件： https://codesandbox.io/s/filter-menu-react-layout-uvppj?file=/src/Layout.js

Answer 1

只需將setFilter作為道具傳遞，您應該對 go 很好。

const Layout = props => {
  const { setFilter, children } = props;
  return (
    <div>
      <Nav setFilter={setFilter} />
      {children}
    </div>
  );
};