1:改写App.js中Child2调用的写法
import React, { Component } from 'react'
import Child1 from "./Child1";
import Child2 from './Child2';
export default class App extends Component {
constructor(props){
super(props);
this.state ={
from:"我是app的数据"
}
}
show=()=>{
alert("66666");
}
render() {
return (
<div>
<Child1>
</Child1>
<Child2 from={this.state.from}>
<button onClick={()=>{
this.show()
}}>按钮</button>
<button onClick={this.show}>按钮</button>
</Child2>
</div>
)
}
}
2:代码说明如图
3:回到Child2.js中 代码如下
import React, { Component } from 'react'
export default class Child2 extends Component {
constructor(props){
super(props);
console.log(props);
}
render() {
var btn = this.props.children[0];
return (
<div>
我是子组件2{this.props.from}
{btn}
</div>
)
}
}
4:代码讲解如图
控制台输出如下
注意:本文归作者所有,未经作者允许,不得转载