ReactJS - 如何通过 for 循环将"link"对象推送到具有唯一值的数组？

Question

问题：如何将唯一链接推送到数组，以便每个链接都有一个唯一的编号，通过 for 循环创建？

我在创建一系列唯一链接时遇到问题。 我已经简化了下面的代码，但我希望每个链接都包含它自己唯一的"i"值。

当我运行此代码并呈现链接时，所有 i 值都设置为 arrayHoldingData 的长度，而不是单个 i 值。

有没有办法做到这一点，所以链接 1 为 i 值 0，链接 2 具有 i 值 1，等等......

var arraysLink = []
for (var i = 0; i < arrayHoldingData.length; i++) {
arraysLink.push(<a href="/" value = {i} onClick={() => console.log(i)} > Click </a>)
}

我在 Stack 上环顾四周，找不到类似的问题。

Answer 1

我认为您为标签添加值的方式是错误的。您正在将字符串推送到数组，并且错过了添加引号。其他想法是你添加值属性的方式value = {i}，我认为它不会按预期工作，你需要像value = '${i}'一样添加。检查代码段，并告知它解决了您的问题。

var arrayHoldingData = [1,2,3,4,5,6,7,8,9];
var arraysLink = []
for (var i = 0; i < arrayHoldingData.length; i++) {
arraysLink.push(`<a href='/' value = '${i}' onClick={() => console.log(${i})} > Click </a>`)
}
console.log(arraysLink)