Question

我正在做一些反应教程并拥有此代码

return (
        <div className="game">
            <div className="game-board">
                <Board
                    squares={current.squares}
                    onClick={(i)=>this.handleClick(i)}
                />
            </div>
            <div className="game-info">
                <div>{status}</div>
                <ol>{/* TODO */}</ol>
            </div>
        </div>
    );

我对js很新，并且在箭头功能方面遇到了一些问题。致电时

onClick={(i)=>this.handleClick(i)}

我如何知道“i”将是一个数字，或者更准确地说，是什么？ js如何知道放在那里的值，所以我实际上得到了我需要的索引？

Answer 1

好的，所以我过去了＃34;我的＆＃34;再次编码，如果我做对了，似乎在这一点上，我只是把处理程序作为一个道具传递给Board-component。在那里，我再次将它传递给我的Square-component作为prop，再次我对处理程序进行实际调用。

这发生在董事会：

renderSquare(i) {
    return (
        <Square
            value={this.props.squares[i]}
            onClick={() => this.props.onClick(i)}
        />
    );
}

这发生在Square：

function Square(props) {
return (
    <button className="square" onClick={props.onClick}>
        {props.value}
    </button>
);

箭头功能参数

1 个答案: