Как перейти к новому экрану после редукционного действия? - PullRequest
0 голосов
/ 01 апреля 2020

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

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

const HomeScreen = ({
  navigation, 
  room,
  user,
  newGame
}) => {

  return (
      <View>
        <Button
          title="Start new game"
          onPress={async () => {
            await newGame({ _id: user._id })
            navigation.navigate('Lobby', { roomId: room._id })
          }}
        />
      </View>
  )
}

const mapStateToProps = state => {
  return {
    room: state.room,
    user: state.user
  };
};

const mapDispatchToProps = {
  newGame
};

export default connect(mapStateToProps, mapDispatchToProps)(HomeScreen)

room._id только устанавливается после того, как newGame завершит работу, вызов его в обработчике onClick не вызовет отправку.

Кроме того, вызов этого метода в методе рендеринга, например:

if(room){
  navigation.navigate('Lobby', { roomId: room._id })
}

, означает, что этот вызов постоянно вызывается каждый рендер и в конечном итоге в каком-то бесконечном l oop.

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

Как я могу форсировать навигацию по экрану после действия с избыточностью?

...