我正在尝试使用此功能在内部进行条件渲染:
renderNewBuildingModel = () =>{
if(this.state.newBuildingModel){
return(
<Modal isOpen={this.state.newBuildingModel} toggle={this.openNewBuildingModel} className={this.props.className}>
<ModalHeader toggle={this.openNewBuildingModel}>New Building</ModalHeader>
<ModalBody>
<ListGroup>
{
this.state.buildings.map((b) => {
<ListGroupItem>
<div className="newBuilding">
<img className="newBuildingImage"src={b.img}/>
<span className="newBuildingName">{b.name}</span>
</div>
<Label className="newBuildingDesc">{b.description}</Label>
<div>
{b.wood != undefined ? <Label className="newBuildingDesc">Wood Cost:{b.wood}</Label>: null}
{b.stone != undefined ? <Label className="newBuildingDesc">Stone Cost:{b.stone}</Label>: null}
</div>
</ListGroupItem>
})
}
</ListGroup>
</ModalBody>
<ModalFooter>
<Button color="secondary" onClick={this.openNewBuildingModel}>Cancel</Button>
</ModalFooter>
</Modal>
)
}
}
我只是得到空的模型屏幕,这是在添加b.stone之后发生的! = ...和b.wood!= ...条件行。
编辑:
我通过及时返回并重写代码来解决问题:)
答案 0 :(得分:1)
我认为您只需删除“ console.log(b)”即可使其正常工作。