javascript - 如何从 React 中动态生成的数组中获取 refs 值

Question

我从 firebase 获取数据，循环遍历它并将其显示在前端。现在，当我单击它时，我试图获取已显示值的 refs 值。例如，当我单击 Dino 时，我应该能够在 Chrome 浏览器的控制台选项卡上看到值“Dino”。

Here is a link to the picture of the array list displayed on react frontend

<ul>
    <li onClick={this.handleSubmit}>        
        {               
            Object.keys(this.props.group).map(function(keyName, keyIndex) {
                return(
                    <div key={keyIndex}>{keyName}</div>
                )
            })
        }
    </li>
</ul>

Answer 1

假设这些“dino、magic & muu”是 this.props.group 中的键，您需要向该 div< 添加一个 onClick 处理程序，所以:

<div key={keyIndex} onClick={() => console.log(keyName)}>{keyName}</div>