how to send data from one component to another component in react?

Question

could you please tell me how to send data from one component to another component in react ? I do like this

 <Route path="/second/:testvalue" component={Second}/>

on Link function

 <Link to="/second/"{this.state.username}><button onClick={this.handleClick}>send data</button></Link>

But it not passing my data

here is my code http://codepen.io/anon/pen/mOYgJV?editors=1011

This doesn't appear to be ReactNative code. Would you please remove the react-native tag. — sheepdog, Dec 26 '16 at 07:53
You should read http://stackoverflow.com/q/22639534/2955679. — lwinkyawmyat, Dec 26 '16 at 08:48

score 0 · Answer 1 · answered Dec 26 '16 at 08:48

0

React is build for Flux pattern. You emit events, than a dispatcher though PubSub pattern passes those event to subscribers, which are usually components.

Take a look at official description at https://facebook.github.io/flux/.

answered Dec 26 '16 at 08:48

Sergey Kovalev

9,110
2
28
32

score 0 · Answer 2 · answered Dec 26 '16 at 08:49

Here you can use props to pass data between two components

<Second data={your data }/>

in First Component you can access the data using props by writing this.props.data.

in your example you can set the state of data on button click and you can pass the state value in <Second data={this.state.data }/>

score 0 · Answer 3 · answered Dec 26 '16 at 13:34

0

Try this:

<Link to={`/second/${this.state.username}`}><button onClick={this.handleClick}>send data</button></Link>

answered Dec 26 '16 at 13:34

Guangning Yu

31
2
7

how to send data from one component to another component in react?

3 Answers3