如何使用JSX和Loadsh将一个元素重复n次 [英] How to repeat an element n times using JSX and Loadsh

问题描述

我在我的应用程序中使用Reaction/JSX是为了实现我想要的，也就是Lodash。

我需要根据条件将一个元素重复一定的次数。我应该怎么做？

以下是元素：

<span className="busterCards">♦</span>;

我是这样分配的：

let card;
if (data.hand === '8 or more cards') {
  card = <span className='busterCards'>♦</span>;
}

所以在本例中，我需要将元素重复8次。使用Lodash的过程应该是什么？

推荐答案

转到这里：

let card = [];
_.times(8, () => {
  card.push(<span className="busterCards">♦</span>);
});

您可能希望向每个span元素添加Key，以便Reaction不会抱怨缺少Key属性：

let card = [];
_.times(8, (i) => {
  card.push(<span className="busterCards" key={i}>♦</span>);
});

有关.times的详细信息，请参阅此处：https://lodash.com/docs#times

这篇关于如何使用JSX和Loadsh将一个元素重复n次的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！