在 React 中获得了点击按钮的 ID,但随后想在 if 中使用该 ID
Have got id of clicked button in React but then want to use that id within an if
我在基于 spfx 的 Web 部件上的列表下方有一个“下一个”和“上一个”按钮。
我在它下面还有另一个列表,还有另外两个 Next 和 Prev 按钮。
我想区分两组按钮并使用我已经在使用的两个功能:
private _listANext(e) {
let currentPage = this.state.ListAPage;
let highestPageNo = this.state.ListAPages;
currentPage = Math.min(highestPageNo,currentPage + 1 );
this.setState({
ListAPage: currentPage,
});
console.log(e.target.id);
}
private _listAPrev(e) {
let currentPage = this.state.ListAPage;
currentPage = currentPage <= 1 ? 1 : currentPage - 1;
this.setState({
ListAPage: currentPage,
});
console.log(e.target.id);
}
以及渲染中的按钮:
<DefaultButton
id="aprev"
text="Prev"
onClick={(e) => this._listAPrev(e)}
/>
<span> {' '}</span>
<DefaultButton
id="anext"
text="Next"
onClick={(e) => this._listANext(e)}
/>
这两个函数为我提供了按钮的 ID,但如果我在 if
中使用该 ID,该 ID 在不同的浏览器上是否会保持相同?我认为有更好的方法来完成我想做的事情!
<DefaultButton
id="aprev"
text="Prev"
onClick={(e) => this._listAPrev(e,id)}
/>
你可以通过this.and获取id并使用它来传递id。
private _listAPrev(e,id) {}
我在基于 spfx 的 Web 部件上的列表下方有一个“下一个”和“上一个”按钮。 我在它下面还有另一个列表,还有另外两个 Next 和 Prev 按钮。
我想区分两组按钮并使用我已经在使用的两个功能:
private _listANext(e) {
let currentPage = this.state.ListAPage;
let highestPageNo = this.state.ListAPages;
currentPage = Math.min(highestPageNo,currentPage + 1 );
this.setState({
ListAPage: currentPage,
});
console.log(e.target.id);
}
private _listAPrev(e) {
let currentPage = this.state.ListAPage;
currentPage = currentPage <= 1 ? 1 : currentPage - 1;
this.setState({
ListAPage: currentPage,
});
console.log(e.target.id);
}
以及渲染中的按钮:
<DefaultButton
id="aprev"
text="Prev"
onClick={(e) => this._listAPrev(e)}
/>
<span> {' '}</span>
<DefaultButton
id="anext"
text="Next"
onClick={(e) => this._listANext(e)}
/>
这两个函数为我提供了按钮的 ID,但如果我在 if
中使用该 ID,该 ID 在不同的浏览器上是否会保持相同?我认为有更好的方法来完成我想做的事情!
<DefaultButton
id="aprev"
text="Prev"
onClick={(e) => this._listAPrev(e,id)}
/>
你可以通过this.and获取id并使用它来传递id。
private _listAPrev(e,id) {}