Q:

My React-Redux project is outputting error when I add an event

I have the following stateless function in my React/Redux project:
const ListItem = props => {
    return (
        <li className={props.item.expand ? 'expanded' : ''}>
            <img src={`https://someUrl`+props.item.image}
                 alt="Illustration"
                 //onLoad={props.showImage.bind({}, props.item.id)}
                 className={props.item.showIllustration ? 'show' : ''}/>
            <h3 className="title">{props.item.title}</h3>
            <p className="date">
                {moment(props.item.date, "YYYY-MM-DD").format('DD/MM/YY')}
            </p>

            <h3 className="amount">{props.item.amount}</h3>
            <button onClick={props.showItem.bind({}, props.item.id)}>
                {props.item.show ? 'Close' : 'Info'}
            </button>

            {props.item.show ? <ItemDetails id={props.item.id} /> : ''}
        </li>
    )
}

It works well. BUT... when I uncomment the //onLoad line, the console outputs the following error:
Warning: Each child in an array or iterator should have a unique "key" prop.

I don't understand why it's asking a unique key, if already set it on the parent component:
listItems.map(element => {
    return (
        <ListItem
            key={element.id}
            element={element}
        />
    )
})

Besides, the error only is shown where I uncomment the event line. What is causing the error, and how can I fix it?

A:

Solved now. I've found the problem was not in the react component, but in the reducer.

