How to redirect user with post data in react.js?

1

npm install react-router-dom

1
2

import React from 'react';
import { Redirect, withRouter } from 'react-router-dom';

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39

class YourComponent extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      redirect: false,
      postData: {}
    };
  }

  handleSubmit = (event) => {
    event.preventDefault();
    
    // Perform any necessary data processing here
    
    // Set post data in state
    this.setState({ 
      postData: { /* Your post data here */},
      redirect: true
    });
  }

  render() {
    if (this.state.redirect) {
      return <Redirect to={{
        pathname: '/target-route',
        state: { postData: this.state.postData }
      }} />;
    }

    return (
      <form onSubmit={this.handleSubmit}>
        {/* Form elements here */}
        <button type="submit">Submit</button>
      </form>
    );
  }
}

export default withRouter(YourComponent);