/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 vote357 views1 answer
React-native resource android:attr/lStar not found in Android
Javascript React
1 vote385 views1 answer
Npm react dropdown
Javascript React
0 vote356 views1 answer
How is react different from normal js
Javascript React
9 votes370 views6 answers
How to check react version
Javascript React
0 vote382 views1 answer
Switch button react value
Javascript React
0 vote376 views1 answer
Relative width and height image react native
Javascript React
1 vote353 views1 answer
React best way of forcing component to update
Javascript React
0 vote395 views1 answer
Aframe react
Javascript React
2 votes337 views3 answers
There might be a problem with the project dependency tree. It is likely not a bug in Create React App, but something you need to fix locally.
Javascript React
1 vote358 views1 answer
React native rename package name
Javascript React