React 陣列渲染變得簡單
在 React 中渲染元素清單是一項常見任務。以下是如何有效地做到這一點：
第一種方法：
<code class="javascript">render() {
const data =[{"name":"test1"},{"name":"test2"}];
const listItems = data.map((d) => <li key={d.name}>{d.name}</li>;
return (
<div>{listItems}</div>
);
}</code>此方法涉及建立React 元素數組，然後將它們渲染在容器div 中。
第二種方法：
<code class="javascript">render() {
const data =[{"name":"test1"},{"name":"test2"}];
return (
<div>
{data.map(function(d, idx){
return (<li key={idx}>{d.name}</li>)
})}
</div>
);
}</code>此方法在return語句中直接使用map函數，簡化了語法。
這兩種方法中的任何一種可用於在 React 中渲染物件數組，具體取決於您的偏好。
以上是如何在 React 中高效渲染數組？的詳細內容。更多資訊請關注PHP中文網其他相關文章！
