1、父组件给子组件传值：
在子组件标签内部定义属性，在子组件内通过this.porps接受到外部传递来的属性
2、子传父
在子组件标签内部定义属性 值为函数 在子组件内部通过this.porps接受到这个函数进行调用 传递需要传递的值
3、非父子组件
手动封装$on $emit $off 将三个方法暴露出去
传值的一方调用$emit 接受值的一方调用$on
4、list.map(cb=>cb(params)
遍历数组，cb是函数名，cb()调用，cb(params)调用，并传入参数
1.父传子： props
2.子传父：方法
App.js（父）
import React ,{Component,Fragment} from "react";
import One from "./One"
export default class App extends Component{
constructor(){
super();
this.state={
msg:"12345678",
oneVal:""
}
}
render(){
let {msg,oneVal} = this.state;
return(
<Fragment>
<One val = {msg} send={this.handlesend.bind(this)}></One>
<h2>接收到子组件的值为：{oneVal}</h2>
</Fragment>
)
}
handlesend(val){
this.setState({
oneVal:val
})
}
}
One.js:（子）：
import React,{Component,Fragement} from "react";
export default class One extends Component{
constructor(){
super();
this.state={
email:"hello"
}
}
render(){
//子传父用props
console.log(this.props)
return(
<div>
<h3>接收到父组件的值：{this.props.val}</h3>
<hr/>
<button onClick={this.handleClick.bind(this)}>发送给父组件</button>
</div>
)
}
//子传父：
//调用父组件里面的方法，并传入形参；
handleClick(){
this.props.send(this.state.email)
}
}
任意组件间传值：
用封装好的$on $emit方法；one 传给 two ，在two里面绑定，one里面调用
one.js:
import React,{Component,Fragement} from "react";
import Observe from "./observe"
console.log(Observe)
export default class One extends Component{
constructor(){
super();
this.state={
email:"hello",
sendTwo:"one给two的数据"
}
}
render(){
//子传父用props
console.log(this.props) //props里面有val send
return(
<div>
<h3>接收到父组件的值：{this.props.val}</h3>
<hr/>
<button onClick={this.handleClick.bind(this)}>发送给父组件</button>
<button onClick={this.handleTwo.bind(this)}>one给two的数据</button>
</div>
)
}
//调用父组件里面的方法，并传入形参；
handleClick(){
this.props.send(this.state.email)
}
handleTwo(){
Observe.$emit("handle",this.state.sendTwo)
}
}
two.js:
import React,{Component,Fragement} from "react";
import Observe from "./observe"
console.log(Observe)
export default class Two extends Component{
constructor(){
super();
this.state={
oneVal:""
}
}
render(){
Observe.$on("handle",(val)=>{
this.setState({
oneVal : val
})
})
return(
<div> 接收到one的数据：{this.state.oneVal}</div>
)
}
}
注：这种传值方式如果two组件隐藏就传不了；