javascript - 如何使用for循环在react组件中列出整数？

我有一个名为rounds和道具current_round的状态。 current_round的默认值为0。我要使用这些值是列出带有整数的按钮。例如，如果rounds的值为4，则列出按钮1、2、3和4。

for (var i =(this.props.order.order.current_round + 1); i<(this.props.order.rounds+1); i++) {

  return (
    <li><button id ={i} class="rounds_btn">{i}</button></li>
    );
  }

为此，我进行了上述的for循环，但它只显示一个整数1的按钮。

我的代码有什么问题？它没有显示任何错误。

提前致谢

最佳答案

我猜它只是返回render函数中的第一个值。您应该将结果放入变量中，然后呈现此变量。

const buttons = [];

for (var i =(this.props.order.order.current_round + 1); i<(this.props.order.rounds+1); i++) {

  buttons.push(
    <li><button id ={i} class="rounds_btn">{i}</button></li>
  );
}

return (<ul> {buttons} </ul>);

关于javascript - 如何使用for循环在react组件中列出整数？，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/41407698/