How to reload page when fired Navigation.goBack event in React-Native-CodePudding

My project is react-native and build with class component. I have some serious problems. My problems is like this.

In SETTING page has an option multinational language setting. Everything is ok. But when I click language setting go to new page of LANGUAGE SETTING. And I select my native language option reload this page and language changed.

And in header component there is base button. When I click back button goes back but doesn't reload my page. How to I solve this problem? I've checked which event fired of react lifecycle. But there is no event. Doesn't use React-readux and only use class component in react-native.

How to solve my problem? Do I need to modify infrastructure of my project.

Please help me as soon as possible. Thanks.

CodePudding user response：

Hi you need to use navigation lifecycle events

componentDidMount() {
    this._unsubscribe = navigation.addListener('focus', () => {
      // the code in here will run when you go back to component
    });
  }

  componentWillUnmount() {
    this._unsubscribe();
  }

for reference check out https://reactnavigation.org/docs/navigation-events/#navigationaddlistener

CodePudding user response：

You can use focus callBack.

componentDidMount() {
this.props.fetchData();
this.willFocusSubscription = this.props.navigation.addListener(
  'willFocus',
  () => {
     ///
  }
);

}