javascript - Changing props of child component with onchange in React -

i trying change props of chart component select. url value not change data_stat2.json in chart, if can see change in url variable via console .

should change in select trigger new render change this.props.url in chart?

var app = react.createclass({ render: function() { var url ="data_stat1.json" function logchange(val) {  url = 'data_' + val + '.json';    console.log(url)}; return (   <grid style={{padding: 10}}>     <row>       <col md={8}>         <select           name="stats"           value="stat1"           options={[               { value: "stat1", label: "stat1" },               { value: "stat2", label: "stat2" }           ]}           multi = {false}           clearable = {false}           searchable={false}           onchange = {logchange}         />       </col>     </row>     <row>       <chart         url = {url}       />     </row>   </grid> ); } }); 

use state , setstate handle passing changing data components:

var app = react.createclass({  getinitialstate: function() {    return {      url: "data_stat1.json",    };  },  handleupdate: function(url) {     this.setstate({       url: url,     });  },   render: function() {  return (   <grid style={{padding: 10}}>     <row>       <col md={8}>         <select           name="stats"           value="stat1"           options={[               { value: "stat1", label: "stat1" },               { value: "stat2", label: "stat2" }           ]}           multi = {false}           clearable = {false}           searchable={false}           onchange = {this.handleupdate}         />       </col>     </row>     <row>       <chart         url = { this.state.url }       />     </row>   </grid> ); } });