gpt4 book ai didi

javascript - 为什么遍历 ES6 Map 不会在 ReactJS 中创建任何子元素?

转载 作者:行者123 更新时间:2023-11-30 07:54:24 25 4
gpt4 key购买 nike

<分区>

我正在尝试创建一个表 React 组件,它将数据和标题作为 Prop 。我遇到了无法获得 forEach 的问题Map 的方法不会创建必要的子元素。

列的输入属性如下所示:

let cols = {
payment: 'Payment',
date: 'Processing Date',
amount: 'Amount',
payee: 'Payee'
};

这是我的 React 表格​​组件生成标题元素的方法:

generateTableHead() {
let columnsMap = new Map((Object.entries(this.props.columns)));
let i = 0;
return (
<tr>
{columnsMap.forEach((columnValue) =>
<th key={i++}>
{columnValue}
</th>
)}
</tr>
);
}

问题是 <th> <tr> 中不存在子项返回的对象;我得到一个空的 <tr></tr> .

但是,如果我使用 Array.prototype.map,子项 <th>元素将被正确创建。

generateTableHead() {
let columnsArray = Object.entries(this.props.columns);
return (
<tr>
{columnsArray.map((column, index) =>
<th key={index}>{column[1]}</th>
)}
</tr>
);
}

我更喜欢第一个版本,因为代码更容易理解,因为我将在 Map 对象中引用键和值,而不是在第二个版本中使用数组索引。

我确信对此有一个非常简单的解释,或者我犯了一个我无法发现的非常简单的错误。如果有人能指出问题所在,我将不胜感激!

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com