1

Hello my problem is that after i redirect to a component using history.push() i pass some user details there and pass it through the problem is when you hit refresh or redirect into another component everything is lost even its undefined. i have found solutions here but only if your on the same server i think. Since i am using java jersey api i cannot use the solutions provided there https://stackoverflow.com/a/36623117/11416547, btw setting the variables into state dosen't work either. Thanks for any help in advance.

onSubmit = e => {
        e.preventDefault();
        fetch(  `/myresource/customer/auth/${this.state.query}/${this.state.password}`,
            {
                method: "POST",
                headers: {
                    credentials: "same-origin"

                },
                credentials: "include",
            })
            .then(res => res.json())
            .then((result) => {
                    this.setState({
                       user: result.customer,

                    });
                    console.log(result.customer);

                    this.cookies.set('token', result.newCookie, { path: '/' });

                    console.log(this.cookies.get('token'));

                    const { history } = this.props;
                    if(history) history.push({
                        pathname: '/dashboard/',                   <-- here i redirect to this component and pass user there
                        search: '',
                        state: {user: result.customer}
                    });
                }
            )
    }


this is my dashboard Component

 constructor(props) {
    super(props);

    this.state = {
        userName: '',
    }

}

componentDidMount() {
    if (typeof(this.props.location.state) != "undefined" ) {  
        this.setState( {userName: this.props.location.state.user.userName},
            () => {userName: this.props.location.state.user.userName}
        );
    }
}

render() {
    return (
      <Container>
          <div>{this.state.userName}</div>
      </Container>
    );
}


I am asking how to keep the state alive on the client side after i redirect to a component with history.push i am not trying to achieve the ``` history.push```  functionality for which is asked in the possible duplicated question how to redirect.
  • Is your component which uses history wrapped with `withRouter` HOC ? – Easwar May 15 '19 at 16:43
  • Possible duplicate of [How to pass params with history.push/Link/Redirect in react-router v4?](https://stackoverflow.com/questions/44121069/how-to-pass-params-with-history-push-link-redirect-in-react-router-v4) – Easwar May 15 '19 at 16:43
  • @Easwar it is not duplicate because there they ask how to redirect at all with the router i am redirecting already i have another problem here... –  May 15 '19 at 16:48
  • As state is not part of the url, on refresh it gets lost. You can store username in local storage on successful login and then get it in Dashboard component. That way on refresh it will stay as is. On logout you can clear it. – Ashish May 15 '19 at 18:18
  • @Ashish Thank you this is working fine i didn't tough about it –  May 16 '19 at 05:28

0 Answers0