Question

我的axios有点问题，我不知道在注册或登录后如何重定向。

这是我的代码：

axios.post("/api/user/signup", { data })
  .then(res => {
    if (res.status === 200) {
      console.log("REDIRECTION avec status => ", res.status);
      // how to redirect here
      <Redirect to = {{ pathname: "/home" }} />
    }

流程到达了console.log调用，但是在React中我找不到如何重定向的方法。

我是React的新手。

感谢您的帮助！

Answer 1

根据您对Redirect组件的使用情况，我假设您正在使用React Router作为路由逻辑库。

反应路由器（v4）在渲染时处理路由。

这意味着重定向将在呈现Redirect组件时发生。

控制状态的一种方法是利用状态。

在React中，更改状态会导致重新渲染。

这是一种方法：

class MyComponent extends React.Component {

  constructor(props) {
    super(props);
    this.state = {
      isSignedUp: false // <-- initialize the signup state as false
    }
  }

  signup() {
    return axios.post("/api/user/signup", { data })
      .then(res => {
        if (res.status === 200) {
          this.setState({ isSignedUp: true }); // after signing up, set the state to true. This will trigger a re-render
        }
  }

  // ...

  render() {
    if (this.state.isSignedUp) {
      // redirect to home if signed up
      return <Redirect to = {{ pathname: "/home" }} />;
    }

    // ... rest of rendering code    
  }

Answer 2

您还可以使用 window 对象重定向：

axios.post("/api/user/signup", { data })
  .then(res => {
    if (res.status === 200) {
      console.log("REDIRECTION avec status => ", res.status);
      
      window.location = "/home";
    }

使用axios进行重定向

2 个答案: