相关疑难解决方法(0)

我面临一个非常奇怪的问题,导致感觉像"无论你怎么样"

首先这里是代码:

renderImages = () => {
    let i = 0;
    const arr = [
        "https://truffle-assets.imgix.net/pxqrocxwsjcc_6OcJeUMaWIYOmKgsK6IwWc_galaxy-cupcakes_squareThumbnail_en-US.jpeg",
        "https://sallysbakingaddiction.com/wp-content/uploads/2017/06/moist-chocolate-cupcakes-5.jpg",
        "http://is4.mzstatic.com/image/thumb/Purple127/v4/74/47/31/7447317e-9844-3ee0-d189-661a55c94abe/source/1200x630bb.jpg",
        "https://i.pinimg.com/736x/55/03/94/550394c428e268868aa73e509302b84c--neopolitan-cupcakes-ice-cream-cupcakes.jpg"
    ];

    return arr.map((item) => {
        i++;
        return(
            <div>
                <img src={item} onClick={() => alert(i)} alt={i} />
            </div>
        );
    })
};

现在当我点击一个图像时,它总是显示4.第一个图像显示4,最后一个图像显示4.所有这些都提醒4.但是,他们的alt标签似乎是正确的.我不认为我做错了什么但我是:)

我的反应版本是16.1.1

所以任何人都知道我在这里做错了什么？我不认为这是一个绑定问题,但谁知道.