react中的组件嵌套

组件嵌套：将子组件以标签的形式写在父组件的模板中。

组件之间的通信

子传父

子传父

通过函数层层传递

 

 

点击h3 执行fn 而fn中去执行onlick函数而onlick是来自于props的，props中的onlick又是ff，转移去执行ff把参数赋给a 修改了a的值。

父传子

.使用props传值

具体实现

import React, { Component } from 'react';

/**父组件 */
export default class Parent extends Component {
    state = {
        msg: 1
    }
    render() {
        return (
            <div onClick={() => this.setState({ msg: this.state.msg + 1 })} >
                {/* 子组件 */}
                <Child msg={"传递给子组件的消息：" + this.state.msg.toString()} />
            </div>
        );
    }
}

/**子组件 */
class Child extends Component {
    // 默认的props 可写可不写
    static defaultProps = {
        msg: 1
    }
    render() {
        return (
            <div>
                {/* 通过props传递过来的参数 */}
                {this.props.msg}
            </div>
        )
    }
}