我是新来的whitreact。我总是在浏览器上看到这样的消息：“列表中的每个子元素都应该有一个唯一的“键” prop ”。我正在使用组件和Bootstrap。
我尝试了不同的方法来传递卡上的API key={values.id}，但出现了问题。有人能帮我吗？

import React, { useState, useEffect } from 'react';

function Home() {

    const [fake, setFake] = useState([]);
    console.log(fake);
    useEffect(() => {
        fakestore();
    }, [])

    const fakestore = async () => {
        const response = await
            fetch('https://api.escuelajs.co/api/v1/products');

        const jsonData = await response.json();

        setFake(jsonData);
    }
    return (
        <>

        <div className='container'>
            <div className='row mt-5'>
                {fake.map((values) => {
                    return (
                        <>
                            
                            <div className='col-12 col-md-6 col-lg-4 mt-5'>
                                <div className="card" key={values.id}>
                                    <img src={values.images} className="card-img-top w-100" alt={values.description} />
                                    <div className="card-body">
                                        <h5  className="card-title">{values.title}</h5>
                                        <p className="card-text">{values.description}</p>
                                        <p className="card-text"><strong>€ {values.price.toFixed(2)}</strong></p>
                                        <button className="btn btn-primary">Add to Wishlist </button>
                                    </div>
                                </div>
                            </div>
                            
                        </>
                    )

                })}
            </div>
        </div>
        </>
    );
}

export default Home;

谢谢
希望修复浏览器上的错误信息。