Solucionado (ver solução)
Solucionado
(ver solução)
2
respostas

[Dúvida] Quando utilizo o componente de Rotas meu aplicativo para de ser exibido

Olá, bom dia!

Meu aplicativo estava rodando normalmente, porém sempre que uso o componente de Rotas ele para de ser exibido e a tela fica toda branca. Mesmo que eu reinicie o bandle ou a aplicação ele continua assim

Insira aqui a descrição dessa imagem para ajudar na acessibilidadeInsira aqui a descrição dessa imagem para ajudar na acessibilidade

Meu arquivo package.json esta assim:

{ "name": "gatito", "version": "1.0.0", "main": "node_modules/expo/AppEntry.js", "scripts": { "start": "expo start", "android": "expo start --android", "ios": "expo start --ios", "web": "expo start --web" }, "dependencies": { "@react-navigation/bottom-tabs": "^5.11.7", "@react-navigation/native": "^5.9.2", "expo": "49.0.15", "expo-status-bar": "1.6.0", "intl": "^1.2.5", "react": "18.2.0", "react-native": "0.72.6" }, "devDependencies": { "@babel/core": "^7.20.0" }, "private": true }

eu instalei o ReeactNavigation utilizando os comandos da ultima aula:

npm install @react-navigation/native@5.9.2 npm install @react-navigation/bottom-tabs@5.11.7

2 respostas
solução!

E aí, Dilmar!

Cara, pelo que você falou, tá parecendo que tem umas tretas nas rotas que tão deixando tua tela branca. Dá uma olhada nesses pontos:

  1. No Rotas.js, vi que você usou component={Servicos} e component={Carrinho} nas tags <Tab.Screen>. Mas olha só, o correto é component e não componente. O React Navigation vai ficar perdido se não for assim.

  2. Lá no App.js, tá tudo certo com o Rotas, mas parece que ele tá dentro de uma <View> que tem uns estilos que podem estar atrapalhando a visualização. Confere se os estilos dessa <View> não estão escondendo as rotas.

  3. Dá um confere pra ver se todas as dependências do React Navigation tão ok. Sei que você seguiu os passos, mas dá uma olhada no node_modules e no console do Expo pra ver se tá tudo nos conformes.

  4. Vê também se não tem nenhum erro nas telas Servicos e Carrinho. Às vezes, um erro numa tela afeta tudo e dá essa tela branca.

Pra arrumar, tenta fazer essas mudanças no Rotas.js:

// Rotas.js
...
<Tab.Screen name="Servicos" component={Servicos}/>
<Tab.Screen name="Carrinho" component={Carrinho}/>
...

E no App.js, só pra garantir que tá tudo certo, deixa assim:

// App.js
...
return (
  <Rotas/>
);
...

Depois dessas mexidas, dá um play no aplicativo pra ver se resolveu. Se ainda der ruim, pode ser que precise fuçar mais no código e ver se tem algum erro mais específico.

Boa sorte aí e qualquer coisa, tô aqui pra ajudar!

Bom dia!

Era realmente a VIew que envolvia o ! Removi ela e voltou a funcionar, valeu!!!

Quer mergulhar em tecnologia e aprendizagem?

Receba a newsletter que o nosso CEO escreve pessoalmente, com insights do mercado de trabalho, ciência e desenvolvimento de software