1
00:00:02,710 --> 00:00:07,840
Agora, vimos a navegação básica com navegar e navegar é a ferramenta mais importante, mas na

2
00:00:08,020 --> 00:00:13,720
verdade, ao estar dentro de uma tela, de um componente carregado com a ajuda de um navegador de

3
00:00:13,870 --> 00:00:15,950
pilha, você tem alternativas para navegar.

4
00:00:15,970 --> 00:00:22,450
Você também pode usar push em vez de navegar, embora isso não use um objeto Javascript, mas use apenas

5
00:00:22,450 --> 00:00:24,240
o nome da rota aqui;

6
00:00:24,250 --> 00:00:30,280
nesse caso, categoria refeições como primeiro argumento e, com isso, você terá o mesmo comportamento de antes.

7
00:00:30,610 --> 00:00:33,200
A questão, é claro, é por que você usaria isso.

8
00:00:33,250 --> 00:00:37,960
O número um é um pouco mais curto do que navegar porque você não está

9
00:00:37,960 --> 00:00:39,440
passando um objeto, mas

10
00:00:39,490 --> 00:00:47,880
esse não é o motivo principal. Em vez disso, usar push aqui pode ser útil se você quiser acessar uma página em que você já esteja.

11
00:00:47,960 --> 00:00:49,100
Agora, deixe-me mostrar o que eu quero dizer.

12
00:00:49,120 --> 00:00:53,560
Se eu reverter isso e navegar para categorias aqui, então para a tela de categoria

13
00:00:53,590 --> 00:00:59,650
que é a tela em que eu já estou. Se eu fizer isso com navegar, o que você verá

14
00:00:59,800 --> 00:01:02,690
é que nada acontece se eu tocar nessa.

15
00:01:02,930 --> 00:01:10,760
Agora, se eu usar o push e, portanto, passar categorias como meu primeiro argumento, porque é assim que o push funciona, você

16
00:01:10,760 --> 00:01:16,490
verá que agora isso funciona e eu posso ir para a mesma tela repetidamente e é

17
00:01:16,490 --> 00:01:19,810
empurrado para a mesma pilha e de novo.

18
00:01:19,820 --> 00:01:26,030
Agora, é claro, você pode se perguntar por que eu iria querer empurrar a tela que eu já estou exibindo novamente.

19
00:01:26,030 --> 00:01:32,150
Agora, em muitos aplicativos, talvez você não precise disso, mas digamos que você esteja criando um aplicativo como o Dropbox, no qual

20
00:01:32,150 --> 00:01:33,370
existem pastas entre

21
00:01:33,380 --> 00:01:35,440
as quais os usuários podem navegar; se

22
00:01:35,570 --> 00:01:38,330
você estiver em uma pasta, deseja ir para outra pasta.

23
00:01:38,330 --> 00:01:44,960
Agora, cada pasta é tecnicamente a mesma tela, apenas com conteúdo diferente carregado nela. Nesse caso, convém ir da pasta A para B,

24
00:01:44,960 --> 00:01:50,720
que usa o mesmo componente, a mesma tela no final, mas com conteúdo diferente; nesse caso,

25
00:01:50,720 --> 00:01:56,540
você pode usar o push para ainda poder empurrar a nova tela que é a mesma

26
00:01:56,540 --> 00:02:02,580
tela na pilha e carrega a mesma tela com conteúdo diferente, esse seria um cenário em que

27
00:02:02,600 --> 00:02:05,860
você poderia precisar disso. Neste aplicativo, não precisamos

28
00:02:05,870 --> 00:02:11,720
dele, portanto não há necessidade de envio, mas você tem isso em cenários em que a

29
00:02:11,720 --> 00:02:13,100
navegação não o

30
00:02:13,100 --> 00:02:15,830
levaria a essa tela, o envio sempre

31
00:02:15,830 --> 00:02:23,630
o levará quando estiver dentro de um navegador de pilha. Aqui, no entanto, vou reverter isso para navegar, que pega um objeto com um nome de

32
00:02:23,630 --> 00:02:31,800
rota que aponta para categorias, porque aqui, absolutamente não precisamos de push, ou seja, refeições de categoria. Portanto, isso serve para este aplicativo, agora você também

33
00:02:31,800 --> 00:02:33,330
tem outras opções

34
00:02:33,330 --> 00:02:36,370
de navegação explícitas, digamos que na tela

35
00:02:36,420 --> 00:02:39,600
da categoria refeição, você deseja poder voltar.

36
00:02:39,840 --> 00:02:45,330
Bem, é claro, podemos voltar com a ajuda desse botão Voltar, mas também não é tão atípico

37
00:02:45,360 --> 00:02:51,140
que, em alguns aplicativos, você tenha alguma outra coisa que seus usuários possam fazer onde quiser levá-los de

38
00:02:51,150 --> 00:02:55,890
volta, por exemplo, digamos você está em uma página onde pode definir algumas

39
00:02:55,890 --> 00:03:01,180
configurações e, quando clicar no botão Salvar, deseja salvar essa configuração e também sair da tela.

40
00:03:01,290 --> 00:03:07,410
Agora, nesse cenário, convém ativar uma navegação traseira manualmente e não espere o usuário pressionar o botão

41
00:03:07,410 --> 00:03:13,260
voltar, pois isso pode forçar o usuário a pressionar primeiro um botão salvar e depois voltar

42
00:03:13,260 --> 00:03:17,040
manualmente, o que não é a melhor experiência do usuário.

43
00:03:17,070 --> 00:03:24,210
Então, aqui, eu meio que simulo isso apenas com um botão voltar aqui em nossa tela, portanto,

44
00:03:24,210 --> 00:03:30,090
em nosso código jsx e quando pressionamos isso, quero poder voltar, quero manualmente acionar

45
00:03:30,090 --> 00:03:31,790
uma navegação para trás.

46
00:03:31,950 --> 00:03:37,740
Você pode fazer isso com a ajuda do suporte de navegação, porque lá, você tem um método de retorno

47
00:03:37,740 --> 00:03:41,030
que pode chamar e isso faz exatamente o que parece.

48
00:03:41,230 --> 00:03:46,380
Se salvarmos isso e eu for para as refeições, se clicar em voltar, reproduziremos a navegação de volta.

49
00:03:46,380 --> 00:03:51,960
Tecnicamente, isso sai da tela em que estamos e volta

50
00:03:51,960 --> 00:03:58,860
para a tela anterior na pilha. Como alternativa para voltar, se você estiver em um navegador de pilha,

51
00:03:58,860 --> 00:04:01,740
também terá pop, que faz o que o nome

52
00:04:02,010 --> 00:04:08,730
implica, aparece a tela atual na pilha e, como você sempre vê a tela superior no seu dispositivo, isso também reproduz a navegação

53
00:04:08,730 --> 00:04:14,240
traseira, portanto, essa é uma alternativa para voltar. A diferença é que o pop só pode ser usado se

54
00:04:14,240 --> 00:04:14,980
você estiver

55
00:04:15,090 --> 00:04:19,770
em um navegador de pilha. Voltar também está disponível em outros navegadores que usaremos mais adiante neste módulo.

56
00:04:22,340 --> 00:04:27,000
Às vezes, você também desejará voltar até o

57
00:04:27,140 --> 00:04:34,730
componente pai, digamos aqui no MealDetailScreen. Aí também podemos adicionar um botão

58
00:04:34,730 --> 00:04:39,390
e nesse botão aqui, quero voltar às minhas

59
00:04:39,390 --> 00:04:49,090
categorias, digamos e, portanto, adicionarei onPress e nessa função aqui, posso usar adereços de navegação pop, certo,

60
00:04:49,090 --> 00:04:56,860
porque isso nos leva de volta .

61
00:04:56,860 --> 00:04:59,230
Bem, o problema com isso, é claro, é que me leva de volta, mas apenas para a tela antes dessa tela, para a tela.

62
00:04:59,230 --> 00:05:03,250
Eu vim de. Eu quero voltar para a tela de

63
00:05:03,250 --> 00:05:06,040
categorias, então eu quero pular duas telas ao mesmo tempo.

64
00:05:06,250 --> 00:05:08,450
Para isso, você abre pop-up, esse é

65
00:05:08,560 --> 00:05:14,260
outro método que você pode chamar, que simplesmente aparece em todas as telas da pilha e o leva de

66
00:05:14,470 --> 00:05:15,970
volta à tela raiz.

67
00:05:16,390 --> 00:05:21,100
Então, se você clicar aqui, obteremos a animação de volta e voltaremos à nossa tela raiz, que

68
00:05:21,220 --> 00:05:22,720
neste caso é a

69
00:05:22,720 --> 00:05:27,570
tela de categoria, então essa é uma alternativa aqui. Agora, com isso, há apenas uma

70
00:05:27,580 --> 00:05:33,780
última ação de navegação possível que você pode precisar. Digamos que na tela de categorias, você deseja ir

71
00:05:34,050 --> 00:05:41,880
para a categoria refeições, mas não deseja adicioná-lo à pilha, mas deseja substituir seu componente atual na pilha por ele, para que ainda

72
00:05:41,940 --> 00:05:47,790
exista apenas uma tela a pilha, mas essa tela é uma nova página, o que também significa

73
00:05:47,790 --> 00:05:49,570
que você não poderá

74
00:05:49,620 --> 00:05:54,630
voltar à nova página porque a pilha ficaria vazia a partir de então, o que

75
00:05:54,630 --> 00:05:56,820
significa que seu aplicativo é fechado.

76
00:05:56,820 --> 00:06:00,990
Portanto, caso queira fazer isso, você pode usar substituir. Substitua também, como o push

77
00:06:01,020 --> 00:06:09,150
usa apenas um identificador como este e o comando também o leva para a nova tela; no entanto, ele não reproduz animação para

78
00:06:09,150 --> 00:06:15,240
frente; em vez disso, salta instantaneamente para lá e você não obtém o botão Voltar automaticamente porque

79
00:06:15,240 --> 00:06:19,030
a pilha está vazia, caso contrário, esse é o única tela.

80
00:06:19,200 --> 00:06:24,540
Isso pode ser usado, por exemplo, em uma tela de login em que um usuário fez login e, uma

81
00:06:24,540 --> 00:06:26,990
vez logado, o usuário não poderá voltar à

82
00:06:27,030 --> 00:06:32,430
tela de login, então você pode simplesmente substituir a tela de login pelo seu login na tela com o

83
00:06:32,430 --> 00:06:34,370
perfil do usuário ou algo assim.

84
00:06:34,620 --> 00:06:39,930
Se você ainda tentar voltar, nada acontece porque você não pode voltar, não

85
00:06:39,930 --> 00:06:44,390
há mais nada na pilha. Portanto, é claro que substituir

86
00:06:44,430 --> 00:06:51,600
não é absolutamente o que precisamos neste aplicativo, eu só queria introduzi-lo aqui, embora veremos mais padrões disponíveis e como você

87
00:06:51,630 --> 00:06:56,810
vai e volta entre as páginas e quando você pode substituir ou alternar as telas

88
00:06:56,830 --> 00:07:02,610
assim em todo este módulo, só queria apresentá-lo já neste momento, ainda aqui, voltarei a navegar

89
00:07:02,910 --> 00:07:10,680
com o nome da rota apontando para as refeições da categoria. E com isso, você teve uma visão geral de alguns dos métodos básicos

90
00:07:10,800 --> 00:07:16,230
de navegação que permitem alternar entre as telas. Como mencionei, é claro que veremos muitos padrões

91
00:07:16,230 --> 00:07:22,500
em ação ao longo deste módulo, por enquanto é isso e eu diria que, fora do caminho,

92
00:07:22,500 --> 00:07:30,180
é hora de realmente adicionar um pouco de carne a esse aplicativo, verifique se é um aplicação mais realista e não apenas

93
00:07:30,330 --> 00:07:33,030
uma aplicação fictícia como é atualmente.