我想在状态==循环索引时将项目设置为事件状态。但我每次都变得虚假。
constructor(props) {
super(props);
this.state = {
currentPage: this.props.currentPage
};
}
render() {
var lis = [];
for (var i=1; i <= this.props.totalPages; i++) {
lis.push(
<PaginationItem
key={i}
active={
this.state.currentPage === {i} ? true : false
}
>
<PaginationLink href="javascript:void(0)" onClick={this.handlePageClick.bind(this, i)} >
{i}
</PaginationLink>
</PaginationItem>
);
}
}
最佳答案
问题是您正在根据 constructor
中的 props 设置状态,并且如果 props 发生更改,它不会更新,您需要更新 componentWillReceiveProps
中的状态功能也。但是,您可以直接使用 props,而不需要将其设置为 state。还可以使用 let
而不是 var
进行迭代器声明,以避免闭包
render() {
var lis = [];
for (let i=1; i <= this.props.totalPages; i++) { // use let here to avoid closure
lis.push(
<PaginationItem
key={i}
active={
this.props.currentPage === i ? true : false
}
>
<PaginationLink href="javascript:void(0)" onClick={this.handlePageClick.bind(this, i)} >
{i}
</PaginationLink>
</PaginationItem>
);
}
// more code here
}
关于reactjs - react : Reactstrap pagination active not working inside loop,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/49550038/