自定义控件子类给父类传递数据

2017-11-06  本文已影响10人  基本密码宋

父控件

import React ,{Component}from 'react'
import MyCommpent from './MyCommpent'


class NewComponent extends  Component{

    handlerOnSumbmit(parmarms){
       console.log(parmarms)
    }

    render() {
        return(
            <div>
                <MyCommpent onParams={this.handlerOnSumbmit}>  //定义 prps为一个方法 通过这个属性传递给里面的子控件
                </MyCommpent>
                 {/*想让 MyCommpent*/}
                 {/*控件将数据传递给他的父控件。*/}
                 {/*就是这个NewComponent 控件  做法是通过 props 来进行传递。让子控件给父控件中的props赋值*/}

            </div>
        )
    }
}


export default NewComponent ;

里面的子控件

import React ,{Component}from 'react'

class MyCommpent extends Component{


    onSubmitData(event){
       this.props.onParams({data:1})  //给父控件赋值
    }


    render(){
        return(
            <div>
                 <button onClick={this.onSubmitData.bind(this)}>
                     点击后的数据传递给他的父类元素
                 </button>
            </div>
        )
    }
}

export default MyCommpent ;
上一篇 下一篇

猜你喜欢

热点阅读