problem description
for example, I have a list page with the current address something/list?page=1, when I click on the next page, the address becomes something/list?page=2. I hope that by clicking the browser"s back button at this time, I will be able to go back to something/list?page=1 and display the content of page=1 correctly.
but although the address has changed after the fallback, the page does not show the content of page=1, but still presents page=2.
the environmental background of the problems and what methods you have tried
my approach is to determine in componentWillReceiveProps whether url needs to be changed, save the current state if necessary, and replace state with the previously saved state, during fallback, but this is only valid for the current component, and you need to do this for every component with the same requirements. Is there a better way to do this? there are no best practices in this common demand industry? I searched for a long time but couldn"t find a better solution. I"m sorry I just got in touch with react and redux,. I"m not familiar with this practice yet.
related codes
componentWillReceiveProps = (props) =>{
if( props.state.shoudlUrlChange ){
const query = objFilter(this.state.query, v =>{
return v && v !== "" && v !== "-1"
})
this.props.history.push("/admin/inwalks?" + qs.stringify(query), props.state)
// action
props.state.shoudlUrlChange = false
}
if( props.location !== this.props.location && props.location.state ){
this.state = props.location.state
}else{
this.state = props.state
}
this.props = props
}