我尝试将父组件的状态作为道具传递给子组件

Question

我在侧边栏上显示汉堡按钮的内容，根据父状态，但我无法访问它，我在另一个项目上遵循相同的步骤，它们可以工作，但在这里它没有

母组件

import React, { useState } from "react"; 
// Layout Related Components
import Sidebar from "./Sidebar";
import Footer from "./Footer";
import Header from "./Header";
const Layout = () => {
const [sidebarActive, setSidebarActive] = useState(true);
return (
<React.Fragment>
<div id="layout-wrapper">
<div className={sidebarActive? " margin-left" : ""}>
<Header />
</div>
<Sidebar
isMobile={true}
isOpen={setSidebarActive}
isActive={sidebarActive}
/>
<Footer />
</div>
</React.Fragment>
);
};
export default Layout;

子组件

import React, { useState } from "react";
const Sidebar = (props, { isOpen, isActive }) => {
return (
{/* Hamburger button */}
<button
className={
isActive
? "hamburgerButton sidebar-oepn"
: "hamburgerButton sidebar-closed"
}
type="button"
onClick={() => isOpen(!isActive)}
>
<i className="fa fa-fw fa-bars" />
</button>
)
}
export default Sidebar;

Answer 1

组件道具在proparg(第一个参数(中可用，函数组件没有其他参数：

const Sidebar = (props) => {
const { isOpen, isActive } = props;
...
}

请参阅组件和道具文档。