J'ai un composant de niveau élevé qui redirige l'utilisateur vers le tableau de bord lors de la connexion. Le problème est que le tableau de bord n'est pas restitué lors de la redirection.

    static getDerivedStateFromProps(nextProps) {
      if (nextProps.user.isAuthenticated) {
        nextProps.history.push("/dashboard");

      }
      if (nextProps.errors) {
        return { errors: nextProps.errors };
      }
      return null;
    }

Quelqu'un pourrait-il savoir quel pourrait être le problème? J'utilise un routeur de hachage en passant

isAuthenticated (FullCode)

import React, { Component } from "react";
import { connect } from "react-redux";
import {  initLogin } from "../../actions/userActions";

export interface authHocProps {
  user?: any;
  history?: any;
  initLogin: () => void;
}
export interface authState {
  errors: object;
}
export default function(WrappedComponent) {
  class IsAuth extends Component<authHocProps, authState> {
    //   this line is magic, redirects to the dashboard after user signs up
    // this replace getDerivedStateFromPropss
    static getDerivedStateFromProps(nextProps) {
      if (nextProps.user.isAuthenticated) {
        nextProps.history.push("/dashboard");

      }
      if (nextProps.errors) {
        return { errors: nextProps.errors };
      }
      return null;
    }
    ourState: authState = {
      errors: {},
    };
    componentDidMount() {
      this.props.initLogin();
      if (this.props.user.isAuthenticated) {
        this.props.history.push("/dashboard");
      }

    }
    render() {
      return <WrappedComponent {...this.props} />;
    }
  }
  const mapStateToProps = (state: any) => ({
    user: state.user,
  });
  const mapDispatchToProps = (dispatch: any) => ({
    initLogin: () => dispatch(initLogin()),
  });
  return connect(mapStateToProps, mapDispatchToProps)(IsAuth);
}
0
BARNOWL 13 janv. 2020 à 23:51