javascript - 通过 div 传递 prop

Question

我正在尝试用reactjs制作一个div板。为了定位板上的元素，我想传递行 ID 和列 ID 等 Prop 。

componentDidMount() {
  let board = [];
  for(let i = 0; i < 30; i++){
    for(let j = 0; j < 50; j++){
      board.push(<div className={"board-element"} row={i} col={j}></div>);
    }
  }
  this.setState({elements: board});
}

for 循环创建一个元素列表，完成后它会更改状态并将列表设置为主 div。

render() {
  return (
    <div className="board center-div">
      {this.state.elements} // HERE
    </div>
  );
}

但是如果我检查渲染的 html，行和列就会丢失。

<div class="board-element"></div>

控制台上有一个警告:

Warning: Unknown props `row`, `col` on <div> tag. Remove these props from the element. For details, see ...

Answer 1

将 row 和 col 更改为 data-row 和 data-col。