父组件示例代码
import React, { Component } from 'react'
import Home from './home'
import './App.css';
class App extends Component{
constructor(props){
super(props);
this.state={
gae:'这是父组件的数据'
}
}
fu(){
alert('我是父组件的数据')
}
po(t){//po方法执行弹出子组件的数据t
alert(t)
}
render(){
return(
<Home fn={this.po}></Home>)//父组件接受数据执行po方法
}
}
export default App;
子组件示例代码
import React, { Component } from 'react'
export default class Home extends Component{
constructor(props){
super(props);
this.state={
msg:'我是隔壁村的王大壮',
pp:'这是子组件的数据'
}
}
bu(text){
this.props.fn(text)//将数据发给父组件
}
render(){
return(
<div>
<button onClick={this.bu.bind(this,this.state.pp)}>获取父组件方法</button>
</div>
)
}
}
结果展现
个人github:https://github.com/webxingkong
如有不正确的地方请指教联系修改,后期将不断更新,谢谢你们的支持