react 的props 父传子的小案例

大家好，我是梅巴哥er ，本篇介绍父传子的简单案例：

App2.js代码如下：

import React, {
    
    Component} from 'react'

// 子组件
class Header extends Component {
    
    
    constructor(props) {
    
    
        super(props)
    }
    render() {
    
    
        return (
            <header>
            {
    
    /* 父组件的title参数 传递给子组件的props 
            然后再被父组件调用 */}
                {
    
     this.props.title }
            </header>
        )
    }
}
// 父组件
class App2 extends Component {
    
    
    render() {
    
    
        return (
            <div>
            {
    
    /* 设置title元素 用来传递给子组件的参数 */}
                <Header title='首页标题' />
                <Header title='分页标题' />
            </div>
        )
    }
}

export default App2