在过滤器和映射中使用模板文字字符串进行 Jsx 连接

Question

我应该怎么做才能更正下面的代码？

<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>

这是有效的

<p>
{ads.filter(obj => obj._id === this.state.selectedAd_Id)
.map(obj => obj.expiry_date
&& fromNow(moment(obj.expiry_date)) )}
</p>

但是当obj.expiry_date 不是null 时，我如何连接You have to complete this task in？

Answer 1

您可以返回一个三元并使用 es6 的模板文字字符串插值。

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))}` : false)

Answer 2

obj.expiry_date || '' 可能会完成这项工作

您也可以使用conditional (ternary) operator obj.expiry_date ? obj.expiry_date : ''