Question

我是react-redux的新手。我在这里做的是，

return analitics.map(analiticss => (
  <div className="col-md-8 d-flex justify-content-around questionDetailRow1">
    <div>
      <span>
        <i
          className="fa fa-check-circle"
          style={{ fontSize: "24px", color: "green" }}
        />
      </span>
      <span className="ml-2">
        {analitics.wrong ? `${analitics.wrong}` : "0"}
      </span>
    </div>
    <div>
      <span>
        <i
          class="fa fa-times-circle"
          style={{ fontSize: "24px", color: "red" }}
        />
      </span>
      <span className="ml-2">{analiticss.wrong}</span>
    </div>
    <div>
      <span className="skip-background">
        <i className="fa fa-fast-forward" style={{ color: "black" }} />
      </span>
      <span className="ml-2">{analiticss.skipped}</span>
    </div>
    <button type="button" className="btn btn-outline-primary">
      Change
    </button>
  </div>
));

因此，在这里我想在任何情况下都具有该div。那么会发生什么，

如果不使用麻醉剂，则不会获得回报。因为没有要迭代的元素。

因此，我想将该值显示为0。{analiticss.skipped}此值。

但是它不返回此元素，因为它没有任何数组元素。

我要解决的一个方法是在其他情况下使用0值明确添加相同的html。

但我认为这不是正确的解决方案。我可以使用其他解决方案吗？

Answer 1

如果您仍然希望包装器div可见，则需要在包装器div内移动map函数。像这样：

2.75*10^{-6}

Answer 2

您可以尝试使用此沙盒链接。

我已经添加了您的代码，并且分析中没有数据。

https://codesandbox.io/s/zwr8391y24

仍然会看到已跳过

使用map函数返回jsx

2 个答案: