1. 程式人生 > >react子元件向父元件傳遞資料例項

react子元件向父元件傳遞資料例項

這個例子很簡單,看一下就懂:

class Son extends React.Component {
  render() {
    return <input onChange={this.props.onChange}/>;
  }
}

class Father extends React.Component {
  constructor() {
    super();
    this.state = {
      son: ""
    }
  }
  changeHandler(e) {
    this.setState({
      son: e.target.value
    });
  }
  render() {
    return
<div> <Son onChange={this.changeHandler.bind(this)}/> <p>這裡顯示 Son 元件的內容:{this.state.son}</p> </div>; } } ReactDOM.render(<Father/>, mountNode);