У меня есть метод в компоненте списка контактов, где я возвращаю другой компонент. У меня это работает, но мне любопытно, если есть лучший способ структурировать, как я использую ключ.

В частности - я спрашиваю об этой строке кода из метода ниже (данные жестко запрограммированы в качестве примера для начала):

return <ShortContact contact={contact} key={contact.id}/>

Вот код в контексте:

_getContacts() {
    let contactList = [
        {
            id: 1,
            fName: "aaa",
            lName: "aaaaa",
            imgUrl: "http://brainstorminonline.com/wp-content/uploads/2011/12/blah.jpg",
            email: "[email protected]",
            phone: "999999999999"
        },
        {
            id: 2,
            fName: "bbbbb",
            lName: "bbbbbbb",
            imgUrl: "https://media.licdn.com/mpr/mpr/shrinknp_200_200/bbb.jpg",
            email: "[email protected]",
            phone: "888888888888"
        },
        {
            id: 3,
            fName: "Number",
            lName: "Three",
            imgUrl: "http://3.bp.blogspot.com/-iYgp2G1mD4o/TssPyGjJ4bI/AAAAAAAAGl0/UoweTTF1-3U/s1600/Number+3+Coloring+Pages+14.gif",
            email: "[email protected]",
            phone: "333-333-3333"
        }
    ];

    return contactList.map((contact) => {
        "use strict";
        return <ShortContact contact={contact} key={contact.id}/>
    });
}

ShortContact Component Render:

class ShortContact extends React.Component {
    render() {
        return (
            <div >
                <li className="contact-short well whiteBG">
                    <img  className="contact-short-thumb" src={this.props.contact.imgUrl}/>
                    <p className="contact-short-name">{this.props.contact.fName}</p><br />
                    <p className="contact-short-email">{this.props.contact.email}</p>
                </li>
            </div>
        );
    }
}

Я боролся с тем, как заставить это работать и не получить предупреждениеWarning: Each child in an array or iterator should have a unique "key" prop. Однако мне интересно, если синтаксис или структура действительны, и если он должен быть реорганизован.