Цикл в JSX, который устанавливает OnClick

Question

Так что мой вопрос очень похож на другой пост о цикле for в jsx. За исключением моего вопроса, меня больше интересует, как установить значение в методе onClick.

    var rows = [];
    var page_index = 10;
    for (var i = 0; i < 6; i++) {
       page_index = page_index + i;
       // note: we add a key prop here to allow react to uniquely identify each
       // element in this array. see: https://reactjs.org/docs/lists-and-keys.html
       rows.push(<ObjectRow key={i} onClick = {() => props.changePage(page_index)}/>);
}
return <tbody>{rows}</tbody>;

По сути, changePage для всех ObjectRows будет вызывать changePage с 15, есть ли способ сделать page_index не переменной? Я пытался сделать это

props.changePage({page_index})

похоже, это не помогает.

Answer 1

Вместо того, чтобы манипулировать page_index, я бы установил начальный индекс страницы и выполнял бы математическую часть внутри вызова функции следующим образом:

    var rows = [];
    var initialPageIndex = 10;
    for (var i = 0; i < 6; i++) {
       // note: we add a key prop here to allow react to uniquely identify each
       // element in this array. see: https://reactjs.org/docs/lists-and-keys.html
       rows.push(<ObjectRow key={i} onClick = {() => props.changePage(initialPageIndex + i)}/>);
}
return <tbody>{rows}</tbody>;