react 父组件调用子组件中的事件

标签：extend   rop   nbsp   keyword   cto   struct   import   string   word   

import React, {Component} from ‘react‘;

export default class Parent extends Component {

　　render() {

　　　　return(

　　　　　　　　<div> <Child onRef={this.onRef} />

　　　　　　　　<button onClick={this.click} >click</button>

　　　　　　　　</div>

　　　　)

　　}

　　onRef = (ref) => {

　　　　this.child = ref

　　}

　　click = (e) => {

　　　　this.child.myName()

　　}

}

class Child extends Component {

constructor(props){
    super(props);
    this.state = {value: ‘‘};
}

　　componentDidMount(){

　　　　this.props.onRef(this)

　　}

　　myName = () => {

　　　　this.setState({value:‘boonook‘});

　　}

render(){
    return(
        <div>
            我是子组件
            <input value={this.state.value} type="text"/>
        </div>
    )
}

}

react 父组件调用子组件中的事件

标签：extend   rop   nbsp   keyword   cto   struct   import   string   word   

原文地址：https://www.cnblogs.com/boonook/p/9598470.html