redux React - react-router v6使用在类组件中导航并设置状态

rseugnpd  于 2022-12-19  发布在  React
关注(0)|答案(1)|浏览(208)

我有一个类组件需要重定向到另一个页面,为此我创建了这个函数来修饰类组件的导出,以便在组件的状态中导航

import { useNavigate } from "react-router-dom";

export const withNavigate = WrappedComponent => props => {
  const navigate = useNavigate();
  // etc... other react-router-dom v6 hooks

  return (
    <WrappedComponent
      {...props}
      navigate={navigate}
      // etc...
    />
  );
};

我想设置重定向页面的状态,并尝试使用以下代码完成此操作

this.props.navigate("/url_to_redirect",{
  state:{
    something:response.data
  }
});

但不起作用,重定向时设置状态的正确方式是什么?此外,url_to_redirect在安装应用程序时定义了其状态,因为这是从主组件呈现的,该组件使用redux thunk的异步函数设置状态,因此该组件具有全局状态集,当重定向时,我的意图是在重定向完成的时刻挂载应用程序时覆盖redux设置的此状态,有没有一种方法可以覆盖这一点,因为我正在尝试或它是更好地创建另一个组件或重构redux逻辑。

toe95027

toe950271#

导出常量,其中导航= Package 组件=〉属性=〉{
为什么需要“WrappedComponent =〉"?
首先必须导入该组件:

import WrappedComponent from “./components/folder”;

// Then… use it;

export const withNavigate = props => {

    return(
      <WrappedComponent
      {...props}
      //…
      />
    );

};

相关问题