React - собственный StackNavigator обновляет предыдущий компонент после нажатия кнопки назад - PullRequest
Новая
       8

React - собственный StackNavigator обновляет предыдущий компонент после нажатия кнопки назад

1 голос
/ 14 марта 2019

Я застрял на несколько недель над этой проблемой, которую не могу решить. Я прошел через множество различных решений, и ни одно из них не работает ..

Скажем, у меня есть компонент A и компонент B

Компонент A: содержит плоский список, когда щелчок по одному элементу приводит меня к компоненту B.

Компонент B: содержит сведения об элементах компонента A, при нажатии кнопки обновляются данные, данные, используемые компонентом A в текущем состоянии, в результате чего выбранные элементы становятся оранжевыми. Я хотел бы, чтобы при нажатии кнопки «Назад» обновлялись эти данные в компоненте А, и на самом деле выделенные элементы были выделены оранжевым цветом, сейчас ничего не происходит ..

Компонент А: 

async interventionList(){
    const planningList = await getInterventionList(this.state.userToken, '2019-02-27', '2019-02-27'); 
    this.setState({list: planningList});
 }

renderItem = ({ item }) => (
    <View>
      <TouchableHighlight onPress={
        () =>  this.props.navigation.navigate('InterventionStart', { getIntervention: () => this.interventionsList() })}>
        <View style={[styles.block, this.state.current !== null && this.state.current.remoteInterventionId === item.num ? styles.began : styles.notbegan]}>
          <Text> {SomeData} <Text>
          </View>
        </View>
      </TouchableHighlight>
    </View>
  )

Компонент B: 

componentWillUnmount() {
    this.props.navigation.state.params.getIntervention();
  }

Но ничего не происходит. Я пытался консоль журнала, чтобы увидеть, если эти функции были вызваны после нажатия кнопки назад, и они ... Так что я не понимаю, что я делаю неправильно, или это не способ сделать это вообще?

1 Ответ

1 голос
/ 14 марта 2019

Вы можете использовать willFocus метод react-navigation

в вашем componentDidMount или в своем конструкторе 

this.willFocus = this.props.navigation.addListener('willFocus', () => {
      this.interventionList();
    });

Он будет вызывать ваш метод interventionList всякий раз, когда ваш компонент собираетсябыть сосредоточены.Убедитесь, что вы удалили слушателя на вашем componentWillUnmount

this.willFocus.remove();

Для справки https://reactnavigation.org/docs/en/navigation-events.html

...