Javascript 将每个索引保存到每个按钮中

我目前正在做一个Tic Tac Toe游戏，希望在每个按钮中显示索引，如下所示。我现在正在用React

<button id="button" index="0" nav-selectable="true" class="Square_Square__1MfjH"></button>
<button id="button" index="1" nav-selectable="true" class="Square_Square__1MfjH"></button>
...
<button id="button" index="8" nav-selectable="true" class="Square_Square__1MfjH"></button>

...

这是我的密码：

const Square = (props) => {
    return (
        <div>
            <button 
                id="button"
                nav-selectable="true"
                key={props.index} // Display this in the button
                className={classes.Square} 
                onClick={() => { props.onClick(); }}
                >
                {props.value}
            </button>
        </div>
    )
}

const Square=（道具）=>{
返回(
{props.onClick（）；}}
>
{props.value}
)
}

类板扩展组件{
renderSquare（一）{
返回{this.props.onClick（i）；}
/>;
}
render（）{
返回(
{this.renderSquare（0）}
{this.renderSquare（1）}
{this.renderSquare（2）}
{this.renderSquare（3）}
{this.renderSquare（4）}
{this.renderSquare（5）}
{this.renderSquare（6）}
{this.renderSquare（7）}
{this.renderSquare（8）}
)
}
}

---

然而，这种方法似乎不起作用。有人能帮我吗？谢谢

如果希望将其作为属性，可以使用

索引

或

数据索引

将方形示例更改为：

<button 
  id="button"
  nav-selectable="true"
  key={props.index} // Display this in the button
  index={props.index}
  className={classes.Square} 
  onClick={() => { props.onClick(); }}
>
  {props.value}
</button>

{props.onClick（）；}
>
{props.value}

如果希望将其作为属性，可以使用

索引

或

数据索引

将方形示例更改为：

<button 
  id="button"
  nav-selectable="true"
  key={props.index} // Display this in the button
  index={props.index}
  className={classes.Square} 
  onClick={() => { props.onClick(); }}
>
  {props.value}
</button>

{props.onClick（）；}
>
{props.value}

索引应该是唯一的，因此您不应该使用id=“button”，而应该使用id=“button Index”之类的东西，其中Index是您的号码。您是否只是尝试在按钮上显示索引，例如文本的位置？现在还不清楚你想做什么。此外，元素

id

属性应该是全局唯一的。是否要在内容中显示

索引

，或者只是作为按钮的道具？我只想在浏览器中这样显示在按钮上，这样我就可以从其他jsIndex中选择它。索引应该是唯一的，所以您不应该使用id=“button”，而应该使用id=“button index”之类的内容索引是你的号码吗？你只是想在按钮上显示索引，比如文本的位置？现在还不清楚你想做什么。此外，元素

id

属性应该是全局唯一的。是否要在内容中显示

索引

，还是仅作为按钮的道具？我只想在浏览器中的按钮上显示，这样我就可以从其他js中选择它