job-React 組件之間的傳遞數據

組件之間用props 傳遞數據
*使用<組件 數據=”值” > 的形式傳遞
*組件裏使用this.props獲取值
*如果組件裏只有render函數 ,還可以用函數的形式寫組件

import React from "react"

class App extends React.Component{
    render(){
        const leader = "Kormma!!!"
        return (
            <div>
                <h4>魔鬼隊伍SKT T1 ,Coach {leader}</h4>
                <Faker ></Faker>
                <Bang ADC = "Bang" ></Bang>
                <Bengi></Bengi>
                <Impact></Impact>
                <Wolf></Wolf>
                <EDG leader = "ClearLove"></EDG>
            </div>
        )
    }
}

class Faker extends React.Component{
    render(){
        const leader = "李湘菏!!!"
        return <h2>AP Carry,{leader}</h2>
    }
}

class Bang extends React.Component{
    render(){
        // const leader = "Bang!!!"
        return <h2>AD Carry,{this.props.ADC}</h2>
    }
}

class Bengi extends React.Component{
    render(){
        const leader = "Bengi!!!!"
        return <h2>打野,{leader}</h2>
    }
}

class Impact extends React.Component{
    render(){
        const leader = "Impact"
        return <h2>上單,{leader}</h2>
    }
}

class Wolf extends React.Component{
    render(){
        const leader = "Wolf"
        return <h2>輔助,{leader}</h2>
    }
}

function EDG (props){
    return <h5>EDG 隊長 ,{props.leader}</h5>
}














export default App