React 的函數組件和類組件中的props
函數組件
函數組件中的props是一個對象直接作爲函數的參數傳入,在組件內容中可以直接用點語法使用props對象中的屬性,代碼如下:
function Test1(props) {
return(
<div>
The user is <b>{props.isLoggedIn? 'jack':'not'} </b>logged in.
</div>
)
}
const element = <Test isLoggedIn={true}/>;
ReactDOM.render(
element,
document.getElementById('app')
)
類組件
在劉組件中的props存放在this中,這一點和VUE中的props類似,但是Vue可以直接使用this後跟屬性名,但是React中還需要this.props後跟相對應的屬性名.
class Test extends React.Component{
render(){
return(
<div>
The user is <b>{this.props.isLoggedIn? 'jack':'not'} </b>logged in.
</div>
)
}
}
const element = <Test isLoggedIn={true}/>;
ReactDOM.render(
element,
document.getElementById('app')
)