[英]complication conditioning in jsx passing prop to component
How can I add a class to the content's <div>
if the expiry_date is null or undefined? 如果expiry_date为null或未定义,如何将类添加到内容的
<div>
? This is challenging because I have to filter and then do map, I'm lost. 这具有挑战性,因为我必须先过滤然后再做地图,我迷路了。
{openApplyModal && <ConfirmModal
visible={openApplyModal}
title={'Take this task'}
handleCancel={this.handleCancelApply}
handleOk={this.handleApplyAd}
loading={loading}
error={error}
content={
<div>
{error ? error :
<div>
<p>{ads.filter(obj => obj._id === this.state.selectedAd_Id).map(obj => obj.expiry_date ? `You have to complete this task in ${fromNow(moment(obj.expiry_date))}` : '' )}</p>
</div>}
</div>
}
/>}
There's nothing wrong with above code, it worked, but output ''
if the expiry_date is not present will leave a empty modal that's why I'm thinking of to add a hide class to the div. 上面的代码没有任何问题,它起作用了,但是如果没有expiry_date,则输出
''
将留下一个空的模式,这就是为什么我要向div添加一个隐藏类的原因。
Add an additional filter for getting rid of any items that have a null expiry_date
to your ads array before mapping it out in JSX: 在JSX
expiry_date
其映射出来之前,添加一个额外的过滤器以消除expiry_date
为空的所有项目到您的广告数组:
content={
<div>
{error ? error :
<div>
<p>{ads
.filter(obj => obj._id === this.state.selectedAd_Id)
.filter(obj => !!obj.expiry_date)
.map(obj => `You have to complete this task in ${fromNow(moment(obj.expiry_date))}`)}
</p>
</div>}
</div>
}
Does this solve your problem? 这样可以解决您的问题吗? If not, please let me know what exactly did you have in mind.
如果没有,请告诉我您的确切想法。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.