唯一键道具仍然收到唯一键错误

Question

我正在尝试在通过 for 循环后列出一个列表。我知道我必须为组件中的每个 child 提供一个“唯一的 'key' 道具”，但无论我如何提供关键道具，我都会不断收到错误消息。键是唯一的，设置在最外层的组件上，并且是一个字符串，但我仍然收到“列表中的每个 child 应该有一个唯一的“键”道具”错误通知。

for循环

const ShowList = () => {
        let newList = []

        for (let i = 0; i < ListItems.length; i++) {
            newList.push(
                <>
                    <ListingItems
                        unit={ListItems[i]}
                        key={ListItems[i]}
                    />
                </>
            )
        }
        return newList;
    }

ListingItems 组件

const ListingItems = ({ unit }) => {

    return (
        <>
            <Text h4 style={[styles.MainText, { color: FontColor }]}>
                {unit}
            </Text>
        </>
    )
}

Answer 1

删除片段 <> 因为在您的特定情况下它是多余的或用 <React.Fragment 替换它并为其分配一个键。

<React.Fragment key={i}>

唯一键道具仍然收到唯一键错误

Unique key prop still receiving unique key error

key

reactjs

react-native