Заставьте ComponentWillUnmount работать до ComponentWillMount

Question

Итак, у меня есть этот код, который выглядит следующим образом:

componentWillUnmount() {
        const {
            changeTableAttribute,
        } = this.props;

        changeTableAttribute({ key: 'loadingTable', value: true });
        changeTableAttribute({ key: 'page', value: 1 });
        changeTableAttribute({ key: 'status', value: '' });
        changeTableAttribute({ key: 'periode', value: 'now' });
        changeTableAttribute({ key: 'warehouse_id', value: 1 });
        changeTableAttribute({ key: 'limit', value: 10 });
        changeTableAttribute({ key: 'search', value: '' });
        changeTableAttribute({ key: 'sort_by', value: '' });
    }

По сути, я хочу сбросить состояние избыточности с помощью dispatch (changeTableAttribute) к его первоначальному значению при переходе с одной страницы на другую. Но проблема в том, что состояние сбрасывается после componentWillMount с другой страницы / компонента, так как я могу дождаться, пока componentWillUnmount завершит выполнение своей задачи, а затем перейти к componentWillMount с другого компонента / страницы? я знаю, что одним из решений этой проблемы является разделение состояния в Redux, но это невозможно, поскольку мне не разрешено изменять код, созданный другим человеком.

Спасибо.

Answer 1

По сути, вы должны попытаться понять, как работают методы lifeCycle. componentWillUnmount будет работать только после выполнения следующего компонента componentWillMount. Таким образом, вы не можете делать, как вы ожидаете. componentWillUnmount выполняется, как только componentWillMount завершает выполнение. Если вы хотите, чтобы поведение, как вы сказали, попробуйте использовать componentDidMount. Надеюсь, поможет!. Счастливое кодирование !!

Answer 2

Вы можете использовать ComponentDidMount во втором компоненте

Answer 3

Я думаю, что есть лучшее решение, это отписаться от хранилища данных,

class MyComponent extends React.Component {
  componentDidMount() {
    mydatastore.subscribe(this);
  }
  render() {
    ...
  }
  componentWillUnmount() {
    mydatastore.unsubscribe(this);
  }
}