Question

如果expiry_date为null或未定义，如何将类添加到内容的<div>？这很有挑战性，因为我必须过滤然后做地图，我迷路了。

{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>
          }
        />}

上面的代码没有任何问题，但它有效，但是如果expiry_date不存在则输出''会留下一个空模态，这就是为什么我想在div中添加一个隐藏类。

Answer 1

添加一个额外的过滤器，以便在将其映射到JSX之前删除任何对广告数组有空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>
}

这可以解决您的问题吗？如果没有，请告诉我你到底在想什么。

jsx中的并发症调节将prop传递给组件

1 个答案: