É claro que queremos despachar essa ação na tela de filtros, porque é aí que
definimos todos esses filtros.
No momento, nós os gerenciamos aqui no estado interno e isso permanecerá assim, porque definitivamente precisamos de nossos
filtros, mas agora é claro
que quero despachar uma ação quando o botão Salvar for pressionado.
Felizmente, eu já tenho a conexão com o cabeçalho configurada com efeito de uso e com parâmetros,
então tudo o que precisamos fazer é substituir o log do console aqui pelo despacho.
Agora, é claro, para usar o dispatch, primeiro precisamos importar o gancho de despacho de uso aqui do React Redux
assim e agora podemos usar
esse gancho aqui para obter acesso à função de despacho, para que const
dispatch seja igual a use o dispatch executado como uma função
e agora podemos chamar despacho aqui para despachar uma ação e, portanto, também precisamos
adicionar despacho como uma dependência, mas o React Redux garantirá que
isso nunca
mude. Portanto, isso nunca provocará uma nova renderização,
nós temos que adicioná-lo.
Portanto, isso é despacho, agora importante, também precisamos importar meu criador de ações das refeições das ações da loja e, claro, estou falando do criador de ações dos filtros de conjunto, porque preciso chamar isso
aqui para criar uma
ação que passo a ser despachada para lá e defina filtros uma vez que este filtro aplicado objeto
encaminhar e lá eu tenho sem glúten, sem lactose, vegan e isso deve ser
apenas vegetariano, importante, porque as chaves que você configurou aqui devem ser as que você procura
em seu redutor , caso contrário, isso não funcionará, importante.
Portanto, verifique se são
iguais, caso contrário, essa lógica não funcionará.
Portanto, agora estamos despachando isso sempre que o botão Salvar é pressionado, e isso
deve ajustar nossas refeições filtradas e isso deve ser refletido na tela de categoria de refeições, porque estamos
recuperando as refeições filtradas. Vamos tentar, vamos
salvar isso
e, por exemplo, esse hambúrguer, provavelmente não vegano.
Então vamos aos filtros, ative o vegan, salve isso e recebo um erro, não consigo encontrar ações variáveis, acionadas pelo redutor de
refeições,
então vamos dar uma olhada nisso. Sim, não são ações, é claro que
são ações,
esse é o nome do argumento.
Portanto, isso deve ser ação,
pequeno erro, apenas um erro
de digitação,
vamos tentar outra vez.
Volte aos filtros, ative
o vegan, salve isso e agora vá para refeições, hambúrgueres e eu não os vejo aqui, o
que é bom, porque isso significa que é filtrado. Meu espaguete com molho de tomate,
ainda está lá, porque obviamente é vegano, pelo menos sem queijo.
Então está aí, em alemão o schnitzel se foi, rápido e fácil,
a salada está lá, o que faz sentido.
Vamos também tentar outro filtro, sem
glúten, agora
o espaguete deve ter sumido com
certeza, então vamos dar
uma olhada, sim, eles se foram.
A salada ainda está
lá, o
espaguete acabou, então essa lógica parece funcionar. Agora, importante, se eu desabilitei
o glúten e, portanto, vejo meus espaguetes novamente, se os adiciono como favorito e depois adiciono esse filtro novamente,
é claro que durante as refeições eles desaparecem, nos favoritos eu os vejo porque essa é a lógica configuramos que os favoritos
não recebem dados de nossas refeições filtradas, mas se preocupam se é um favorito
ou não.
É claro que você pode alterar essa lógica, mas aqui a lógica é o que é e apenas
as refeições nas categorias aqui são filtradas de acordo com os filtros que você configurou aqui.
Agora, seria bom ter uma pequena mensagem de fallback aqui se não tivermos dados por
causa de nossos
filtros e, portanto, na tela de categoria de refeições, também quero verificar aqui se a duração das refeições exibida é zero, o que significa que não
tenho refeições para exibir e, em seguida, quero retornar uma visualização aqui com meu texto padrão, na verdade, e isso significa que
precisamos importar ambos, precisamos importar uma visualização e também precisaremos da folha de estilo do React Native e importar o componente
de texto padrão de texto padrão dos componentes e adicione um estilo aqui, styles.
o conteúdo e o texto padrão que exibimos não podem ser encontrados, talvez
verifique seus filtros, apenas uma dica
de que talvez seus filtros estejam desativando as receitas que você deve ver aqui.
Agora, vamos apenas adicionar os estilos constantes aqui, onde criamos uma nova folha de estilo, e lá,
quero configurar essa chave de conteúdo onde uso o flex one e, em seguida, centralizar o
conteúdo horizontalmente e verticalmente com a ajuda dessas propriedades do flexbox, assim.
Se agora tentarmos e talvez testar isso no Android, apenas para
misturar as coisas, mesmo que seja um pouco mais lento, posso ir aos meus filtros lá, definir sem glúten, voltar para minhas refeições, italiano, portanto, isso não
é lá, então eu recebo esta mensagem. Por outro lado, rápido e fácil, tenho
uma refeição e, portanto, não recebo essa mensagem e, portanto,
isso não parece muito ruim e, é claro, também vamos tentar desativar esse filtro novamente e
voltar, aqui está o espaguete . Então, agora está tudo funcionando e é assim que podemos gerenciar nosso estado com o Redux.