[英]React: How to conditionally render?
我有三個組成部分A,B和C。
我有兩個標志showA和showB。
我該如何實現?
您可以通過不同的方式來實現它。
render() {
const { showA, showB } = this.state;
if (showA) return <A />
if (showB) return <B />
return <C />
}
render() {
const { showA, showB } = this.state;
return (
<div>
{(showA && !showB) && <A />}
{(showB && !showA) && <B />}
{(!showA && !showB) && <C />}
</div>
)
}
class APP extends React.Component {
constructor() {
super();
this.state = { showA: false, showB: false };
}
render() {
const {showA, showB} = this.state;
return [showA && <A/>, showB && <B />];
}
}
我想你的意思是showA和showB都為false時顯示C組件
假設您的showA和showB是狀態屬性:
render() {
return (
this.state.showA
? <A />
: this.state.showB ? <B />
: <C />
)
}
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.