一个表说rowKey应该是唯一的，当它们看起来是唯一的

Question

目前有一些react代码的问题。

我有一个产品列表，每个产品有7个项目数组，其中有40个数据在这种格式下用作表的数据源。

{label : someStringLabel, key: someUniqueKey, attribute1: someInt,..., attributeN: someInt}

产品列表中的所有表都是使用我的render方法中的循环生成的。

{productForecast.map((productLocation, index) => {
let productDescription =
productLocation.product_description
.charAt(0)
.toUpperCase() +
productLocation.product_description.slice(1) +
' - ' +
productLocation.location_description
.charAt(0)
.toUpperCase() +
productLocation.location_description.slice(1);
return (
<>
<Collapse accordion>
<Panel header={productDescription} key='1'>
<Table
scroll={{ x: true }}
pagination={false}
components={components}
bordered
columns={columnsToUseProdLoc}
dataSource={productLocation.data}
rowKey={record => record.key}>
</Table>
</Panel>
</Collapse>
<Divider />
</>
);
})}

密钥是用这个方法生成的，看起来是唯一的:'

const objTrend = { label: 'Trend', key: "Trend_" + element.product_id + "_" + element.location_id + key  };

当我登录到我的应用程序，然而，我得到这个错误列表中的每个子元素都应该有一个唯一的"键"。道具!"当我尝试在updateEditedCell方法上记录rowKey时，rowKey返回未定义

当我检查HTML代码或我的网页时，我可以看到正确的数据-行键

你们能帮我看看发生了什么事吗?

我尝试在对象的key属性上使用rowKey属性设置rowKey，但到目前为止没有结果。

Answer 1

您可能在呈现之前没有键，所以它会导致错误，然后添加键