[创建一组条目时将唯一变量传递给onClick函数

Question

我正在尝试为每张Card在ReactJS中发送一个唯一密钥，因此当我单击它时，我可以用单词执行一些操作，例如使用Flask从数据库中删除条目。如下所示，当前的设置仅将元素的最后一个键渲染到所有卡上，这很有意义，但我找不到相同的另一种方法。

for ( var key in elements) {    
        items.push(
            <Card>
                <CardBody>
                    <CardTitle>
                        {key}
                        <Button className='btn-simple btn-icon btn-round xButton' color='danger' onClick={() => this.NotLearnt(key)}><FontAwesomeIcon icon={faTimes}/></Button>
                    </CardTitle>
                    <CardText className="meaning">{elements[key]}</CardText>
                </CardBody>
            </Card>
        )
    }

[基本上，我想要的是如果我有一个像{'a'：'A'，'b'：'B'，'c'：C}这样的字典，我想在单击时传递'a'第一张卡而不是最后一个键的'c'

编辑：正如Shubham回答的那样，使用let over var减小了变量的范围，因此仅传递了相关值。

Answer 1

for ( let key in elements) {    
    items.push(
        <Card>
            <CardBody>
                <CardTitle>
                    {key}
                    <Button className='btn-simple btn-icon btn-round xButton' color='danger' onClick={() => this.NotLearnt(key)}><FontAwesomeIcon icon={faTimes}/></Button>
                </CardTitle>
                <CardText className="meaning">{elements[key]}</CardText>
            </CardBody>
        </Card>
    )
}