技術標籤：reactpropsreact

元件的props

• 要接收元件外部的資料可以通過props來實現
• props用來接收傳遞給組建的資料
• 資料的傳遞可以用給元件標籤新增屬性的方式
• 接收資料：函式元件可以通過引數props來接收資料，類元件可以通過this.props接收資料，

例項：
類元件傳遞資料：

class Hello extends React.Component {
    render() {
    console.log(this.props);
        return (
            <div>
                <div>
 
接收到的資料：{this.props.name}</div>
                <div>接收到的資料：{this.props.age}</div>
            </div>
        )
    }
}

ReactDOM.render(<Hello name="123" age={19} />, document.querySelector('#root'))

函式元件傳遞資料：

function Hello(props) {
    console.log(props);
    return
 
 (
        <div>
            <div>接收到的資料：{props.name}</div>
            <div>接收到的資料：{props.age}</div>
        </div>
    )
}

ReactDOM.render(<Hello name="123" age={19} />, document.querySelector('#root'))

執行以上程式碼結果如下：

執行以上程式碼控制檯列印結果如下：