Как открыть один и тот же экран несколько раз с различным контентом, используя реагировать родную навигацию v2? - PullRequest
0 голосов
/ 30 сентября 2019

Цель состоит в том, чтобы повторно использовать один и тот же пользовательский интерфейс экрана с другим содержимым и при этом иметь возможность обрабатывать обратную навигацию (например, как приложение reddit может отображать несколько экранов пользователей / каналов при нажатии на них, но по-прежнему обрабатывать пользовательскую обратную навигацию), используя реагировать на роднуюnavigation v2?

пытается использовать динамические идентификаторы экрана и использовать их в переменных состояния. Я не слишком далеко продвинулся в этом подходе.

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

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

КОД:

Домашний экран:

Navigation.push(this.props.componentId, {
  component: {
    name: 'example.formScreen',
    passProps: {
      data: some props
    },
    options: {
      topBar: {
        title: {
          text: 'form Screen'
        }
      }
    }
  }
});

на экране формы:

<View>
<Button 
title="save form"
onpress = ()=>{
Navigation.push(this.props.componentId, {
      component: {
        name: 'example.formScreen',
        passProps: {
          data: some other props
        },
        options: {
          topBar: {
            title: {
              text: 'form Screen'
            }
          }
        }
      }
    });
}/>
<Button
title="go back"
onPress={()=>Navigation.pop(this.props.componentID)}
/>
</View>

Ответы [ 2 ]

0 голосов
/ 30 сентября 2019

Если вы хотите перейти на тот же экран и передать параметры, попробуйте снова отобразить текущий экран на текущем экране.

this.props.navigation.push('currentscreen',{param: "params"})
0 голосов
/ 30 сентября 2019

При переходе к экрану необходимо передавать параметры вместе с маршрутом навигации, и эти параметры будут содержать данные, которые помогут заполнить содержимое на новом экране. Здесь приведен пример передачи параметров в реагировать на встроенную навигацию v2, и функциональность кнопки «Назад» будет такой же, как вы можете открыть предыдущий маршрут, чтобы перейти назад.

Navigation.push(this.props.componentId, {
  component: {
    name: "ShowAnotherScreen",
    passProps: {
     data: item
    }
  }
})
...