/Javascript/React/React router dom two page form

React router dom two page form

handleSubmit = (event) => {
  event.preventDefault();
  this.props.history.replace({
    pathname: "/result",
    state: {
      value:
        "Your saving range is: $" +
        Math.floor(1.69 * this.state.square * (10 / 100)) +
        "- $" +
        Math.floor(1.69 * this.state.square * (30 / 100))
    }
  });
};

class Result extends Component {
  render() {
    return (
      <div className="result">
        <h2>You could save between</h2>
        <h1>{this.props.location.state.value}</h1> // <-- route state
        <NavLink to="/">Use Calculator Again</NavLink>
      </div>
    );
  }
}

Source: stackoverflow.com

Similar codes

0 vote125 views1 answer
React native icon onpress remove highlight onpress
Javascript React
0 vote107 views1 answer
React google map doesn't update marker
Javascript React
1 vote115 views2 answers
Export 'Redirect' (imported as 'Redirect') was not found in 'react-router-dom'
Javascript React
1 vote117 views1 answer
React manifest.json 404 (not found)
Javascript React
0 vote118 views1 answer
React how to block render if data is not fetched yet
Javascript React
0 vote121 views1 answer
Add React Router to React Redux CRUD App
Javascript React
1 vote118 views1 answer
Get value of input element on button click react
Javascript React
0 vote132 views1 answer
How to get back image and front text in react native
Javascript React
0 vote114 views1 answer
Return multiple native element react native
Javascript React
2 votes125 views2 answers
React native text get number of lines
Javascript React