Reactjs 使用自定义挂钩在React Typescript中传递道具

我制作了一个自定义的

useToggler

hook，我正在尝试将切换道具从它传递到标题中的按钮子级。当我尝试toggle={toggle}时，我得到一个错误：

类型“{toggle:（）=>void；}”不能分配给类型“intrinsicationAttributes&{children？：ReactNode；}”

如何使用typescript实现这一点

import './style/app.css';
import Header from './components/Header';
import SideDrawer from './components/SideDrawer'
import Backdrop from'./components/Backdrop'
import useToggler from "./components/UseToggler";

const App = () => {
    const [show, toggle]=useToggler()

    return (
        <div className="App">
            <Header toggle={toggle} />
            <SideDrawer/>
            <Backdrop/>
            <main style={{marginTop:'56px'}}>
                <p>Page content</p>
            </main>
        </div>
    );
}

export default App;

import./style/app.css'；
从“./components/Header”导入标题；
从“./components/SideDrawer”导入SideDrawer
从“./components/Background”导入背景
从“/components/useToggler”导入useToggler；
常量应用=（）=>{
const[show，toggle]=useToggler（）
返回(
页面内容

);
}
导出默认应用程序；

您将得到类似的错误，因为您违反了接口类型检查。组件应该有一个强制的道具。您可以通过传播要传递的道具来避免此错误：

<Header {...toggler} />

谢谢！我怎样才能把这些道具传给里面的孩子呢？我已经做到了，但是我需要把道具再往下传一层。。。但我不能这样做，因为typescript事先不知道

{…toggler}

包括

切换

。你可以这样做：

太好了，谢谢你，希望我不会打扰你。。。现在我有了按钮，我需要把onClick属性和切换功能。。。