How to send data via LINK in react js?

Asked Aug 26 '18 at 19:29

Active Aug 26 '18 at 19:35

Viewed 295 times

I'm working with react js and I'm looking for a solution to send data via Link. When I click on a menu it redirect me to another page and I want to get a data from previous page so this is what I did:

 <Menu>
    <Menu.Item>

      <Link to="/servicecontreservice" params={{ dataToSend: '55' }} >Proposer un service</Link>
    </Menu.Item>
    <Menu.Item>
      <Link to="/prix">Proposer un montant</Link>
    </Menu.Item>
  </Menu>

and in the an anther file there is this code to get data from Link:

class myClass extends React.Component {



  state = {
    value:`${this.props.dataToSend}`}



  render() {
    return(
<p> {this.state.value}</p>
     );
  }
}

myClass.propTypes = {
  classes: PropTypes.object.isRequired
};

export default withStyles()(myClass);

...but I get no data, when I use console.log(${this.props.eventName}) I got "undifined".

edited Aug 26 '18 at 19:35

Timisorean

1,388
7
20
30

asked Aug 26 '18 at 19:29

Maryem Samet

What lib are you using? – Arup Rakshit Aug 26 '18 at 19:30
i'm using react-router-dom for Link and antd for the Menu.item – Maryem Samet Aug 26 '18 at 19:32
I think you want `this.props.params.dataToSend` – Atlante Avila Aug 26 '18 at 19:35
to get your params you should use this: this.props.route.params.dataToSend – Marouen Mhiri Aug 26 '18 at 19:37
@AtlanteAvila now i get this error : TypeError: Cannot read property 'params' of undefined – Maryem Samet Aug 26 '18 at 19:41
@MarouenMhiri i got this now ; TypeError: Cannot read property 'params' of undefined – Maryem Samet Aug 26 '18 at 19:42
Take a look at this: https://github.com/ReactTraining/react-router/blob/master/packages/react-router-dom/docs/api/Link.md#to-object – Atlante Avila Aug 26 '18 at 20:15
`` – Atlante Avila Aug 26 '18 at 20:15
1

You should send your 'params' in the as the value to the search key in the object. Also, you need to note that the React component looks really wonky to me. I haven't been able to test it, but you're setting state in the wrong way, you should use the constructor and super methods. – Atlante Avila Aug 26 '18 at 20:17
@AtlanteAvila when i write Link this way how can i get the params ? – Maryem Samet Aug 26 '18 at 21:40
@MaryemSamet: which version of 'react-router-dom' do u use? – Marouen Mhiri Aug 27 '18 at 07:33
Try to `console.log(location.search);` you will need to parse this with a library called query-string. `import qs from 'query-string';`. Take a look at this: https://stackoverflow.com/questions/35352638/how-to-get-parameter-value-from-query-string – Atlante Avila Aug 27 '18 at 07:36
thank u that helped , the problem i had is i didn't write the contructor and super , thank you very much for your help – Maryem Samet Aug 27 '18 at 16:34

How to send data via LINK in react js?

0 Answers0

Linked