Обновите представление после Pop с реакции-native-router-flux - PullRequest
0 голосов
/ 06 февраля 2019

У меня большая проблема с моим первым приложением React Native.Сегодня я потратил несколько часов, чтобы найти решение, но, к сожалению, мне ничего не помогает.

У меня есть два представления:

<Router>
    <Stack>
      <Scene key="objectsList"
         component={ ObjectsList } title="Objects"
         onRight={() => Actions.addObject()} rightTitle="Add object" />
      <Scene key="addObject" component={ AddObject } title="Add" />
    </Stack>
</Router>

Первое представление - это FlatList, в котором отображаются данные, загруженные изAsyncStorage.Пользователь может добавить новый объект, нажав правую кнопку Добавить объект на панели навигации.AddObject Сцена будет присутствовать на экране.Есть еще один FlatList с некоторыми опциями.Пользователь может нажать на ячейку, а затем данные сохраняются в AsyncStorage, и после этого я вызываю функцию Actions.pop();.

Вид исчез, но я не смог обновить первый экран Объекты для перезагрузки данных и отображения нового значения.Я перепробовал много решений от git, stackoverflow и других форумов.У меня ничего не работает.

Я использую react-native-router-flux для маршрутизации.

Я буду рад за помощь или пример кода, потому что я застрял на этой проблеме, и это заблокирует мой проект.

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

РЕДАКТИРОВАТЬ:

После реализации решения, предложенного Phyo к сожалению, я не смог обновить данные должным образом.Когда пользователь выбирает что-то на сцене AddObject, он возвращается к первому виду, но ничего не происходит.Изменение вступает в силу после второго открытия пользователем сцены AddObject.Функция из реквизита работает только тогда, когда снова появляется сцена 2.

Моя вторая попытка выглядит так:

ObjectsList

  state = { selectedObject: "" }

  componentDidMount() {
    this.loadSelectedObject();
  }

  refreshState() {
    this.loadSelectedObject();
  }

  loadSelectedObject() {
    AsyncStorage.getItem('ObjectKey', (err, object) => {
      if (object) {
        this.setState({ selectedObject: object })
      }
    });
  }

render() {
  return(
    <Button onPress={() => Actions.addObject({onBack: refreshState()})}>
  );
}

Добавить объект

onPressItem = (object) => {
    AsyncStorage.setItem('ObjectKey', object, () => {
      this.props.onBack;
      Actions.pop();
    });
  };

  render() {
     return (
       <FlatList
            data={this.state.objects}
            keyExtractor={(item, index) => item}
            key={this.state.numColumns}
            numColumns={this.state.numColumns}
            renderItem={(data) =>
              <LineCell onPressItem={this.onPressItem} object={String(data.item.object)} />
     );
   }

Ответы [ 2 ]

0 голосов
/ 11 февраля 2019

Я нашел решение с помощью друга.Код:

ObjectsList

  state = { selectedObject: "" }

  componentDidMount() {
    this.loadSelectedObject();
  }

  refreshState() {
    this.loadSelectedObject();
  }

  loadSelectedObject() {
    AsyncStorage.getItem('ObjectKey', (err, object) => {
      if (object) {
        this.setState({ selectedObject: object })
      }
    });
  }

render() {
  return(
    <Button onPress={() => Actions.addObject()}>
  );
}

Добавить объект

onPressItem = (object) => {
    AsyncStorage.setItem('ObjectKey', object, () => {
      Actions.pop();
      Actions.refs.objectsList.refreshState(); //Solution
    });
  };
0 голосов
/ 06 февраля 2019
  • В первом представлении создайте функцию, например, refreshFirstView(), и передайте эту функцию второму представлению.
  • Во втором представлении вызовите эту функцию this.props.refreshFristView(), прежде чем вызывать * 1006.*
  • В вашем refreshFirstView() в первом представлении просто вызовите все функции, которые вы вызывали для получения из AsyncStorage.

Первый взгляд

componentDidMount(){
  retrieveAsynStorageItems()
  doSomeOtherLikeFilteringOrSorting()
}

refreshFirstView(){
  retrieveAsynStorageItems()//by calling this func again you will get newly saved item
  doSomeOtherLikeFilteringOrSorting()
}

Надеюсь, это то, что вам нужно.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...