Как отправить данные на родительскую страницу с помощью React Native Navigation (v5)? - PullRequest
Новая
       62

Как отправить данные на родительскую страницу с помощью React Native Navigation (v5)?

2 голосов
/ 22 февраля 2020

Я использую https://reactnavigation.org/ (версия 5.0.1) в моем проекте с клиентом GraphQL Apollo.

У меня есть страница с формой, где пользователю нужно выбрать некоторые параметры из списка.
На первой странице у меня есть кнопка с этим кодом: 

props.navigation.navigate('SelectTagsPage', {
            onSelect: (selectedIds) => {
              // update the form state
              setTagsIds(selectedIds)
            },
          });

На странице тегов у меня есть это: 

const { onSelect } = props.route.params;

//...

<Button onPress={() => { onSelect(ids) }}>

Итак, в основном я передаю функцию при вызове navigation.navigate и выполняю эту функцию для отправки данных обратно на начальный экран.

Это работает очень хорошо, однако, когда я открываю TagsPage, я получаю это предупреждение:

Мы нашли несериализуемые значения в состоянии навигации, которые могут нарушить использование, такое как сохранение и восстановление состояния. Это может произойти, если вы передали несериализуемые значения, такие как функция, экземпляры классов и т. Д. c. в параметрах

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

1 Ответ

1 голос
/ 22 февраля 2020

Вы можете передавать их как параметры: 

navigation.navigate('NameOfPreviousScreen', { selectedIds });

Когда вы navigate переходите на предыдущий экран, он действует как goBack, но также передает любые параметры, которые вы хотите.

https://reactnavigation.org/docs/en/params.html

...