React JSX 中的 forEach() 不输出任何 HTML

JS

React JSX 中的 forEach() 方法是用于遍历数组或类数组对象的函数。它可以帮助我们在 React 组件中动态生成多个元素。然而，需要注意的是，forEach() 方法并不会返回任何 HTML。在本文中，我们将探讨如何使用 forEach() 方法，并提供一些案例代码。

JSx
const data = ['元素1', '元素2', '元素3'];
const elements = [];
data.forEach((item, index) => {
  elements.push(<div key={index}>{item}</div>);
});
return <div>{elements}</div>;

JSx
const list = document.querySelectorAll('.item');
const elements = [];
Array.prototype.forEach.call(list, (item, index) => {
  elements.push(<div key={index}>{item.textContent}</div>);
});
return <div>{elements}</div>;