1
00:00:02,190 --> 00:00:07,590
Para adicionar o item de ação ao cabeçalho, farei algo que fiz também na seção de navegação, na pasta

2
00:00:07,800 --> 00:00:09,480
de componentes, desejo adicionar meu

3
00:00:09,660 --> 00:00:11,470
próprio botão de cabeçalho e, agora,

4
00:00:11,550 --> 00:00:17,160
adicionarei uma nova subpasta em lá que eu vou nomear interface do usuário e minha idéia aqui é simples.

5
00:00:17,580 --> 00:00:23,340
Eu tenho a pasta da loja que contém todos os componentes que eu uso na minha

6
00:00:23,340 --> 00:00:30,090
loja, que produzem algumas informações relacionadas à loja. Na pasta UI, quero ter alguns blocos

7
00:00:30,090 --> 00:00:35,580
de construção gerais da interface do usuário que, é claro, também uso neste

8
00:00:35,610 --> 00:00:42,240
aplicativo de loja, mas que não estão realmente focados na saída de dados relacionados à loja

9
00:00:42,270 --> 00:00:51,680
ou ao produto, mas que simplesmente existem para fornecer estilo ou layout padrão. nesta pasta da interface do usuário em que adicionarei meu próprio

10
00:00:53,540 --> 00:01:02,330
botão de cabeçalho, importando o React do React e importando o botão do cabeçalho dos botões do cabeçalho de navegação do React,

11
00:01:02,330 --> 00:01:10,370
este pacote que eu instalei no início do módulo, se você não tiver feito isso , certifique-se de instalar o

12
00:01:11,090 --> 00:01:15,760
npm neste pacote e também importe Ionicons do @ expo / vector-icons.

13
00:01:15,850 --> 00:01:23,640
Agora, para ter certeza absoluta de que você o tem instalado, execute o npm install --save @ expo / vector-icons, para que

14
00:01:23,640 --> 00:01:26,220
este pacote esteja disponível no seu projeto.

15
00:01:26,220 --> 00:01:28,070
Essas são as importações que eu

16
00:01:28,110 --> 00:01:35,990
preciso aqui, agora também quero importar minhas cores da pasta constantes e aí, as cores. arquivo js e agora aqui, adicionarei meu componente de

17
00:01:35,990 --> 00:01:43,880
botão de cabeçalho personalizado, que é um componente React normal no final que recebe adereços e precisa retornar algum

18
00:01:43,880 --> 00:01:51,390
jsx e, é claro, exportarei meu botão de cabeçalho personalizado aqui no final e agora o jsx retornado

19
00:01:51,390 --> 00:01:58,020
aqui é o botão do cabeçalho que estou importando dos botões do cabeçalho do React

20
00:01:58,020 --> 00:02:05,090
Navigation, mas preciso configurá-lo de uma certa maneira. Use o botão do cabeçalho aqui dos botões

21
00:02:05,190 --> 00:02:10,280
do cabeçalho do React Navigation. Por um lado, ele deve receber todos os

22
00:02:10,280 --> 00:02:15,310
adereços que obtemos aqui, então apenas os encaminhamos, mas além disso, definirei meu componente de ícones

23
00:02:15,320 --> 00:02:18,460
aqui como Ionicons, para que sempre usemos Ionicons para renderizar

24
00:02:18,470 --> 00:02:24,670
isso e, claro, você poderia usar um dos os diferentes conjuntos de ícones vetoriais fornecidos pelo @ expo / vector-icons também.

25
00:02:24,860 --> 00:02:30,800
Definirei o tamanho do ícone como 23, que achei muito bom, mas é claro que você também pode experimentar

26
00:02:30,800 --> 00:02:33,140
valores diferentes aqui, talvez também se estiver

27
00:02:33,140 --> 00:02:40,370
usando um conjunto de ícones diferente, experimente um tamanho de ícone diferente. E para a cor, depende de tudo, porque no

28
00:02:40,490 --> 00:02:41,990
Android temos um

29
00:02:41,990 --> 00:02:47,150
fundo vermelho aqui, no iOS não temos, então precisamos definir uma cor diferente com

30
00:02:47,150 --> 00:02:50,680
base na plataforma em que estamos rodando, então eu

31
00:02:50,780 --> 00:02:59,760
vou na verdade, importe a plataforma do React Native aqui e, em seguida, podemos verificar a plataforma aqui e, se a versão do

32
00:02:59,870 --> 00:03:01,870
sistema operacional for Android, sei

33
00:03:01,880 --> 00:03:04,970
que tenho esse plano de fundo de campo

34
00:03:05,000 --> 00:03:10,820
sólido; portanto, o ícone deve estar branco. Por outro lado, no iOS, o fundo não é

35
00:03:11,120 --> 00:03:19,090
preenchido, é transparente e, portanto, no iOS, definirei minha cor do ícone como Cores. primário.

36
00:03:19,150 --> 00:03:26,980
Agora podemos usar isso para adicionar um ícone aqui na tela de visão geral dos produtos, nas minhas opções

37
00:03:26,980 --> 00:03:27,490
de

38
00:03:27,490 --> 00:03:35,800
navegação aqui, quero adicionar minha seção de cabeçalho à direita, portanto, um ícone à direita do meu cabeçalho e para

39
00:03:35,800 --> 00:03:42,610
isso aqui, precisamos importar algumas coisas, precisamos importar botões e itens do cabeçalho do pacote React

40
00:03:42,610 --> 00:03:44,660
navigation header buttons que instalamos.

41
00:03:44,800 --> 00:03:53,780
É claro que também preciso importar meu próprio botão de cabeçalho dos botões de cabeçalho da interface do usuário dos componentes. Portanto, neste

42
00:03:53,780 --> 00:04:03,720
componente em que trabalhamos e agora lá embaixo, o cabeçalho à direita é um botão de cabeçalho como um invólucro para possivelmente ter vários itens, mas

43
00:04:04,140 --> 00:04:10,950
vou adicionar apenas um item, um elemento de fechamento automático, nos botões do cabeçalho antes de continuarmos com

44
00:04:10,950 --> 00:04:17,430
o item, precisamos definir o componente do botão do cabeçalho igual ao botão do cabeçalho, portanto, para

45
00:04:17,430 --> 00:04:23,820
o nosso próprio botão de cabeçalho aqui. E o item agora pode ser configurado, ele deve receber um título

46
00:04:23,820 --> 00:04:24,290
que

47
00:04:24,340 --> 00:04:28,840
pode ser carrinho, ele deve receber um nome de ícone e, na verdade, eu quero usar um ícone

48
00:04:28,980 --> 00:04:34,590
diferente com base na plataforma em que estamos executando, portanto, a partir de React Native, I vai importar a plataforma, isso é opcional,

49
00:04:34,590 --> 00:04:39,270
você pode usar o mesmo ícone para ambas as plataformas, mas acho que também parece bom ter ícones diferentes.

50
00:04:39,270 --> 00:04:47,820
E aqui, vou verificar o SO da plataforma e, se for Android, quero usar o ícone md cart, que é o ícone do carrinho Ionicon para design

51
00:04:47,820 --> 00:04:54,360
de materiais, caso contrário, usarei o ícone do carrinho iOS e, novamente, você encontrará todos os disponíveis ícones nesta lista de

52
00:04:54,360 --> 00:04:57,140
ícones que mostrei no início do curso, a

53
00:04:57,240 --> 00:05:03,540
lista de ícones expo / vector-icon e por último, mas não menos importante, quando o item é pressionado, provavelmente queremos

54
00:05:03,540 --> 00:05:09,000
fazer alguma coisa e, por enquanto, não faço nada além de nós. vou mudar isso em breve.

55
00:05:11,260 --> 00:05:12,850
Se agora salvarmos isso,

56
00:05:12,880 --> 00:05:13,500
veremos

57
00:05:13,500 --> 00:05:15,220
este ícone aqui, aqui

58
00:05:15,280 --> 00:05:21,250
está, aqui está nosso carrinho, também no Android e agora apenas precisamos garantir que, quando tocamos

59
00:05:21,340 --> 00:05:27,250
nele, somos levados para a tela do carrinho. Para isso, é claro, temos que adicionar alguma lógica ou alguma saída à tela do carrinho.

60
00:05:27,880 --> 00:05:31,610
Portanto, dentro da tela do carrinho, é claro

61
00:05:31,720 --> 00:05:34,070
que temos um componente React

62
00:05:34,090 --> 00:05:43,420
normal, por isso importamos o React do React, também importamos algo do React Native e que algo é um componente de exibição

63
00:05:43,540 --> 00:05:48,120
para envolver nossa tela, talvez, provavelmente produzimos algum texto também.

64
00:05:48,380 --> 00:05:54,780
Vamos listar alguns itens do carrinho, o que podemos fazer com uma lista

65
00:05:54,800 --> 00:06:01,580
simples para ter a otimização integrada, provavelmente queremos estilizar algumas coisas com uma folha de

66
00:06:01,670 --> 00:06:11,060
estilo e também importarei o componente do botão interno. Agora, a tela do meu carrinho aqui, como sempre, é um componente React e eu configurarei esse

67
00:06:11,060 --> 00:06:16,910
objeto de estilos aqui com a Folha de estilo. crie para que possamos estilizar esse componente

68
00:06:17,000 --> 00:06:21,030
também e, no final, exportamos nossa tela de carrinho aqui como padrão.

69
00:06:21,070 --> 00:06:24,930
Agora, é claro que você pode construir essa tela do carrinho da maneira que desejar, eu

70
00:06:24,940 --> 00:06:32,640
a construirei para ter uma visão e, nessa visão, quero ter duas seções principais. A seção superior é como o resumo em

71
00:06:32,640 --> 00:06:37,660
que vejo o valor total e onde tenho o botão "Encomendar agora".

72
00:06:37,980 --> 00:06:43,050
Isso estará em uma linha, então terei uma visualização aninhada aqui, onde posso posicionar itens

73
00:06:43,590 --> 00:06:46,810
próximos um do outro, onde tenho um texto em

74
00:06:46,810 --> 00:06:55,240
que digo total e depois aqui cifrão e talvez meu preço total. Também podemos aninhar isso, você pode ter componentes de

75
00:06:55,250 --> 00:07:03,620
texto aninhados, se você se lembrar, sem problemas, de dar a ela uma cor separada, por exemplo, então,

76
00:07:03,620 --> 00:07:08,670
por enquanto, eu codifico 19. 99 lá, mas mais tarde isso será derivado dinamicamente.

77
00:07:08,840 --> 00:07:10,330
Então isso

78
00:07:10,430 --> 00:07:18,610
é uma coisa e, além disso, nessa mesma linha, quero ter um botão com um título de

79
00:07:18,700 --> 00:07:26,120
pedido agora, onde posso pressioná-lo para fazer um pedido, limpar meu carrinho e adicioná-lo aos

80
00:07:26,120 --> 00:07:28,750
meus pedidos que ainda precisamos

81
00:07:28,760 --> 00:07:38,200
gerenciar e envie-o na tela de pedidos no final. Agora, abaixo desta seção de resumo, quero ter uma lista simples com meus itens de carrinho separados, para que

82
00:07:38,200 --> 00:07:39,960
possamos realmente ver o que está

83
00:07:39,970 --> 00:07:43,360
no carrinho, quais produtos estão lá, quanto de cada produto está lá, então

84
00:07:43,360 --> 00:07:47,860
isso é outra coisa que eu vai sair lá. No momento, adicionarei uma visualização com um

85
00:07:47,860 --> 00:07:52,090
texto dos itens do carrinho como espaço reservado, mas novamente, essa será uma lista simples

86
00:07:52,090 --> 00:07:57,660
no futuro, mas vamos começar com o total aqui. Para obter esse total, podemos acessar o Redux

87
00:07:57,660 --> 00:08:04,780
porque lá estamos gerenciando nosso carrinho, para que possamos usar o seletor de React Redux conforme você aprendeu a obter dados

88
00:08:04,780 --> 00:08:10,810
de nossa loja e aqui, eu tenho o valor total do meu carrinho, talvez o que eu recebo

89
00:08:11,010 --> 00:08:21,360
com a ajuda do seletor de uso do meu estado. carrinho, fatia. carrinho aqui, porque

90
00:08:21,390 --> 00:08:27,030
no aplicativo. js em redutores combinados, designei uma chave de carrinho aqui para o redutor de carrinho.

91
00:08:29,060 --> 00:08:33,160
Então aqui estou eu. carrinho e depois lá, dentro do

92
00:08:33,380 --> 00:08:40,780
redutor do carrinho, eu gerencio minha quantidade total e o campo de quantidade total, então é isso que precisamos acessar aqui, quantidade total.

93
00:08:40,800 --> 00:08:45,570
Isso fornece uma quantidade total ao carrinho e agora podemos usá-lo lá e com

94
00:08:45,730 --> 00:08:49,820
isso para garantir que isso também pareça bom, é hora de estilizar.

95
00:08:49,910 --> 00:08:56,450
Então, na vista superior aqui, adicionarei um estilo de tela, talvez porque isso envolva a

96
00:08:56,450 --> 00:08:57,680
tela inteira

97
00:08:57,680 --> 00:09:03,820
no final; então, nessa exibição, adicionarei um estilo de resumo, porque contém todos os

98
00:09:03,920 --> 00:09:07,130
itens de resumo, e aqui neste texto,

99
00:09:09,710 --> 00:09:20,790
adicionarei um estilo de texto de resumo e, em seguida, aqui, adicionarei um estilo de quantidade, para que possamos estilizar esse texto de maneira diferente.

100
00:09:22,270 --> 00:09:23,930
Então, para os

101
00:09:23,950 --> 00:09:34,840
estilos que eu quero definir, vamos até a folha de estilo e adicionar tela, resumo, texto de resumo e, também, como o nomeei?

102
00:09:35,300 --> 00:09:41,820
quantidade e, claro, é sempre sempre com você como você deseja estilizar isso.

103
00:09:41,820 --> 00:09:47,400
Agora vou começar com a tela, no final, quero tirar o tamanho máximo da tela, se precisarmos com

104
00:09:47,400 --> 00:09:54,420
a lista simples mais tarde, mas vou começar simples e diremos apenas que quero ter uma margem em todas direções realmente aqui de 20,

105
00:09:54,420 --> 00:10:03,390
então em torno de tudo, para que haja algum espaço em torno de tudo. Em seguida, aqui, resuma qual é a nossa caixa com todos os

106
00:10:03,390 --> 00:10:09,210
itens lá com o pedido agora e nosso texto deve usar uma direção flexível da

107
00:10:09,210 --> 00:10:12,820
linha para posicionar os itens em uma linha.

108
00:10:12,870 --> 00:10:19,950
Fui alinhar itens no centro para garantir que eles fiquem centralizados verticalmente e em seu eixo

109
00:10:20,040 --> 00:10:28,670
principal. Quero justificar o espaço do conteúdo entre eles para que os itens tenham espaço livre entre eles e os itens

110
00:10:28,670 --> 00:10:35,040
sejam este texto aqui e este botão. Além disso, podemos adicionar um pouco de margem aqui,

111
00:10:35,040 --> 00:10:36,360
talvez também 20,

112
00:10:36,360 --> 00:10:42,540
o que é importante também para ter algum espaçamento entre o resumo e nossa lista simples, portanto,

113
00:10:42,540 --> 00:10:49,990
na verdade, usarei o fundo da margem aqui para ter apenas alguma margem para o bottom e quero adicionar um preenchimento

114
00:10:49,990 --> 00:10:55,030
de 10 aqui, porque o resumo deve estar em uma caixa elevada e, para

115
00:10:55,030 --> 00:11:05,050
essa caixa aqui, irei ao componente do item de produto e copio minha sombra configurada aqui e na borda raio talvez eu tenha aqui e a cor do plano

116
00:11:05,770 --> 00:11:12,030
de fundo, para que eu tenha a mesma aparência aqui no carrinho e é claro que depende de

117
00:11:12,040 --> 00:11:16,020
você se você quer ou não, mas eu copio isso lá.

118
00:11:17,420 --> 00:11:27,410
Para o texto de resumo, agora quero usar uma família de fontes open sans bold para realmente destacar esse total e um

119
00:11:27,980 --> 00:11:33,290
tamanho de fonte 18 e, para a quantidade de texto, definirei a

120
00:11:33,290 --> 00:11:36,880
cor como cores. cor de destaque.

121
00:11:36,890 --> 00:11:44,160
Agora, para o que é importante, é claro, você precisa importar cores da pasta constantes e, em seguida, uso

122
00:11:44,150 --> 00:11:50,710
sotaque e não primário para realmente destacar isso. Para ver se isso parece com o que queremos, precisamos

123
00:11:50,710 --> 00:11:55,660
ter certeza de que tocar nesse botão de cabeçalho na tela de visão geral do produto

124
00:11:55,660 --> 00:11:59,520
nos leva à tela do carrinho e, para isso, são necessárias duas coisas.

125
00:11:59,800 --> 00:12:04,510
Por um lado, precisamos navegar aqui, mas antes que possamos fazer isso,

126
00:12:04,510 --> 00:12:11,890
precisamos registrar a tela do carrinho em nosso navegador. Então, eu vou fazer isso primeiro, importarei minha tela do carrinho aqui da

127
00:12:11,890 --> 00:12:17,980
pasta de telas sem surpresa, da pasta da loja e da tela do carrinho e agora essa é a terceira tela que eu

128
00:12:17,980 --> 00:12:26,350
adiciono aqui a este navegador de pilha, pontos do carrinho na tela do carrinho . Com essa configuração adicionada aqui, podemos voltar à tela de visão

129
00:12:26,350 --> 00:12:33,220
geral do produto e, agora, precisamos desse formulário funcional para as opções de navegação, porque os dados de

130
00:12:33,220 --> 00:12:37,670
navegação nos permitem acessar o suporte de navegação e chamar a navegação,

131
00:12:37,990 --> 00:12:41,240
portanto, precisamos agrupar isso em outro objeto que

132
00:12:41,300 --> 00:12:50,610
retornamos e então aqui podemos chamar navData. navegação. navegar e lá, eu vou ao carrinho e,

133
00:12:50,700 --> 00:12:54,950
é claro, esse é o identificador que escolhi no navegador da

134
00:12:55,050 --> 00:12:58,530
loja aqui, este. Com isso, vamos ver, se

135
00:12:58,580 --> 00:13:01,050
eu clicar aqui, aqui estamos, esse é

136
00:13:01,050 --> 00:13:01,740
o

137
00:13:01,740 --> 00:13:03,030
meu total. Na

138
00:13:03,030 --> 00:13:06,610
verdade, acho que a cor do destaque não é tão

139
00:13:06,780 --> 00:13:13,170
boa lá, então voltarei à tela do carrinho e o estilizarei para usar o cor primária também, mas o

140
00:13:15,490 --> 00:13:22,060
principal é que podemos ir lá e se agora tentar adicionar itens ao carrinho, adicionei a camisa duas vezes

141
00:13:22,060 --> 00:13:29,400
e o tapete uma vez, esse valor total me parece bom. Vamos também tentar isso no Android, é claro, para garantir que

142
00:13:29,400 --> 00:13:35,700
funcione lá também e geralmente funcione, eu adiciono mais uma camisa vermelha e, portanto, aqui também vemos um

143
00:13:35,700 --> 00:13:41,730
problema com a maneira como isso é exibido. Para corrigir isso, na tela do carrinho, verifique se, no

144
00:13:41,760 --> 00:13:48,600
preço, sempre produzimos apenas duas casas decimais no valor com também fixo. Agora, a propósito, caso você esteja se perguntando de

145
00:13:48,600 --> 00:13:51,350
onde isso veio, esse número longo,

146
00:13:51,540 --> 00:13:57,150
isso não é um bug ou nada realmente para React Native, esse é um comportamento

147
00:13:57,150 --> 00:14:05,080
Javascript normal quando você está trabalhando com números de ponto flutuante e, é claro, para corrigir não deve ser chamado no

148
00:14:05,110 --> 00:14:11,440
estilo aqui, mas no valor total do carrinho. Portanto, esse era um comportamento normal,

149
00:14:11,440 --> 00:14:18,530
não um bug. É assim que o Javascript armazena internamente números de ponto flutuante, mas

150
00:14:18,530 --> 00:14:29,830
agora garantimos que o resultado seja gerado corretamente com duas casas decimais. O que falta é o botão e aqui agora eu realmente quero usar cores, cores acentuadas

151
00:14:30,760 --> 00:14:37,190
para que meu botão seja colorido com destaque. Então, se agora eu vou ao meu carrinho aqui no iOS, é assim

152
00:14:38,920 --> 00:14:41,500
que o botão fica lá, agora é assim no Android.

153
00:14:41,590 --> 00:14:46,690
Sempre podemos pressionar isso, é claro que eu quero desativá-lo, mas se não houver nada no

154
00:14:46,990 --> 00:14:55,090
carrinho e para isso, agora precisamos também obter os itens do carrinho. Assim, os itens do carrinho também podem ser buscados com o seletor de

155
00:14:55,090 --> 00:15:01,320
uso, também da fatia do carrinho, mas lá estão os itens propostos no redutor do carrinho em que estamos interessados.

156
00:15:01,320 --> 00:15:09,150
Então, se eu der uma olhada no redutor do carrinho, você verá que temos a propriedade items.

157
00:15:09,310 --> 00:15:11,260
Este é um objeto que estou

158
00:15:11,270 --> 00:15:18,280
recuperando agora; portanto, os itens do carrinho são um objeto, não uma matriz. Na verdade, uma matriz seria melhor para mim aqui e, portanto, usarei o

159
00:15:18,370 --> 00:15:25,750
formulário longo para obter isso e retornarei uma matriz aqui e não um objeto. Assim, podemos obter nossos itens de carrinho transformados aqui,

160
00:15:25,750 --> 00:15:36,260
por exemplo, criando uma nova matriz aqui dentro dessa função seletora e, em seguida, podemos adicionar um loop for / in para passar por

161
00:15:36,260 --> 00:15:43,910
todas as chaves no estado. carrinho. itens, para percorrer todos os

162
00:15:43,910 --> 00:15:47,120
pares de valores-chave neste objeto de itens

163
00:15:47,120 --> 00:15:51,200
de carrinho que temos lá e quero adicionar cada um

164
00:15:52,950 --> 00:16:01,030
deles como um item aos itens de carrinho transformados. Então, pressionarei um objeto Javascript que possui um ID do produto, digamos que é

165
00:16:01,060 --> 00:16:06,850
apenas a minha chave, porque no objeto de itens do carrinho de ID, o ID do produto é armazenado como

166
00:16:06,850 --> 00:16:07,930
uma chave, se

167
00:16:07,930 --> 00:16:14,320
você se lembra, então agora eu o adiciono à propriedade ID do produto neste objeto, adiciono à matriz de itens de carrinho transformados

168
00:16:15,300 --> 00:16:27,240
e, além disso, terei o título do meu produto, que é obviamente o estado. carrinho. itens para a chave

169
00:16:27,240 --> 00:16:30,550
fornecida. productTitle.

170
00:16:30,650 --> 00:16:37,900
Se você der uma olhada no modelo do item do carrinho, verá que, título do produto e preço do produto são

171
00:16:37,900 --> 00:16:41,510
os nomes das propriedades que mantêm o título e o

172
00:16:41,560 --> 00:16:43,570
preço do produto. É assim que

173
00:16:43,570 --> 00:16:49,790
acessamos os dois, então eu farei o mesmo aqui pelo preço do produto e, posteriormente, também preciso da

174
00:16:49,790 --> 00:16:58,770
quantidade que é estado. carrinho. itens para a chave fornecida. quantidade e, claro, também a soma que é estado. carrinho. Itens. chave. soma, novamente, basicamente, exatamente o que tínhamos aqui no item do carrinho.

175
00:16:58,770 --> 00:17:05,640
Então, o que estou fazendo é dizer

176
00:17:05,640 --> 00:17:10,260
que estou criando um novo item de carrinho, mas não com o meu modelo porque

177
00:17:10,260 --> 00:17:17,690
é um item de carrinho com uma propriedade de ID de produto adicional, para que eu tenha isso aqui e agora é essa matriz

178
00:17:17,690 --> 00:17:24,300
de itens de carrinho transformados que retorno depois disso para o loop for, para que esse seletor no final retorne uma

179
00:17:24,330 --> 00:17:25,850
matriz e não um

180
00:17:26,040 --> 00:17:32,760
objeto, de modo que os itens do carrinho sejam agora uma matriz que facilita o uso na lista simples e também

181
00:17:32,760 --> 00:17:38,730
permite verificar aqui no botão fazer pedido agora, se queremos desativá-lo, basta verificar o comprimento dessa matriz que temos

182
00:17:39,210 --> 00:17:41,000
agora nos itens do carrinho.

183
00:17:41,010 --> 00:17:42,720
Então, aqui no botão, podemos

184
00:17:43,170 --> 00:17:49,260
definir o suporte de desativação que ele suporta, felizmente, este é um componente interno que simplesmente possui um suporte desativado e lá

185
00:17:49,260 --> 00:17:56,790
posso verificar se o comprimento dos itens do carrinho é igual a zero, se for, então eu sei que está vazio e, na verdade, quero desativar o botão. Portanto, desativado recebe verdadeiro ou falso, por padrão é falso, mas eu o configurarei como verdadeiro se o comprimento

186
00:17:56,790 --> 00:18:01,650
dos itens do carrinho for 0. E agora você vê se eu vou

187
00:18:01,730 --> 00:18:08,020
para a tela do carrinho, isso está desativado. Se eu

188
00:18:08,020 --> 00:18:16,800
adicionar um produto e for para lá, ele está ativado e, é claro, você também pode usar uma cor diferente para o botão "Encomendar agora", se quiser.

189
00:18:16,890 --> 00:18:20,540
Agora, com isso, estamos um passo mais perto

190
00:18:20,550 --> 00:18:26,580
dos carrinhos acabados e, claro, o próximo objetivo é produzir os itens do carrinho.