/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

1 vote217 views1 answer
How to setup React Context, useContext Hook
Javascript React
3 votes167 views3 answers
How to install formik in react native
Javascript React
0 vote196 views1 answer
Upload image file in react native using rest api to website
Javascript React
18 votes200 views6 answers
Add svg in react
Javascript React
0 vote201 views1 answer
Publish reactjs package to gitlab repository
Javascript React
0 vote209 views1 answer
React native typescript nodejs timeout
Javascript React
14 votes151 views9 answers
Attempted import error: 'switch' is not exported from 'react-router-dom'.
Javascript React
0 vote146 views1 answer
How to make a textarea unwritable in react native
Javascript React
2 votes206 views1 answer
Passing multiple props to child component in react
Javascript React
2 votes204 views2 answers
React detect screen size
Javascript React