Я использую react-rematch
вместо redux
, и всякий раз, когда я выполняю диспетчерское действие, мой компонент снова монтируется, поэтому на странице возникают колебания, и меня каждый раз бросают в верхнюю часть страницы.
Эта проблема не в каждом компоненте, она существует только в том случае, если я использую react-router
вместе с ней
Мой маршрут помещен в разделенный контейнер @zippytech/react-toolkit/SplitContainer
<SplitContainer>
<SplitContainer.Side>
<Route exact path="/app/:orgId/xyz/:status/configureActivity/:xyzId" component={componentBox(ConfigureActivity)} />
</SplitContainer.Side>
</SplitContainer>
Мой компонент
class ConfigureActivity extends React.Component {
constructor(props) {
super(props);
this.state = {
leafActivityError: null
}
}
async componentWillMount() {
let selectedDataById = this.props.selectedDataById;
let objValidation = Object.entries(selectedDataById).length === 0 && selectedDataById.constructor === Object;
if (objValidation) {
await dispatch.xyz.getInDesignInitiativeDetailsById(this.props.match.params.xyzId);
}
}
render(){
//It contains TreeView from "@zippytech/react-toolkit/TreeView" on clicking of each Item I am dispatching some action which updated the data In props to this component, due to which page gets remount
}
}
function mapStateToProps(state) {
return {
selectedOrganisation: state.app.selectedOrganisation,
resourcePaneFlag: state.initiatives.resourcePaneFlag,
xyzId: state.initiatives.xyzId
};
}
const connectedConfigureActivity = connect(mapStateToProps)(ConfigureActivity);
export default connectedConfigureActivity;
Я хочу, даже если данные обновляются в основном состоянии, этот компонент должен только повторно отображаться, а не повторно монтироваться. Пожалуйста, помогите мне решить эту проблему.