如何在重定向中传递道具功能

Question

我有一个切换 useState 变量的函数。我有一个切换变量的函数。在我的 App.js 中，我有一个组件的重定向。我不确定如何通过 prop 通过重定向功能到组件。我要传递的切换函数称为 onToggle，执行切换的函数称为 whichchoice。我尝试了以下无济于事。任何帮助，将不胜感激。 ======== App.js ========

<Switch>
          {getRoutes(routes)}
          <Redirect from="*" to="/dashboards/default" onToggle={whichchoice} />
</Switch>

======== 组件 dashboard/default =======

};
function Default(onToggle) {

return (
  <SuiBox mt={4} mb={1}>
            <SuiButton
              variant="gradient"
              color="info"
              size="large"
              fullWidth
              onClick={() => {
                onToggle();
              }}
            >
)

Answer 1

      <Redirect from="*" to={{
        pathname: "/dashboards/default",
        state: { onToggle: whichchoice }
      }}/>

然后在您的默认组件中访问它：

console.log("onToggle",this.props.location.state.onToggle);}

Answer 2

我想您可以使用 useLocation() 挂钩访问它。 https://v5.reactrouter.com/web/api/Hooks/uselocation

我猜是这样的：

function Default(onToggle) {
const location = useLocation() 
return (
  <SuiBox mt={4} mb={1}>
            <SuiButton
              variant="gradient"
              color="info"
              size="large"
              fullWidth
              onClick={() => {
                location.state?.onToggle();
              }}
            >
)

如何在重定向中传递道具功能

How to pass a prop Function in a Redirect in react

jsx

reactjs