[React Native] Como atualizar um componente através de outro componente ?
10/10/2022
0
Tenho os componentes Categorias e Cards.
A página home chama os componentes:
Cards contém uma Flatlist como data (dados) = parcerias.
No entando, o componente Categorias precisa filtrar as parcerias pela categoria. Deixei assim:
Só que aí quando clico na categoria não acontece nada em Cards, e se em Cards eu deixo assim:
Aí entra em loop.
Código do buscaParcerias:
A página home chama os componentes:
<View> <Search /> <Categorias /> <Cards /> </View>
Cards contém uma Flatlist como data (dados) = parcerias.
const parcerias = useParcerias(); Esse hook customizado fiz assim: export default function useParcerias(categoria) { const carregaParcerias = async (categoria) => { const resultado = await buscaParcerias(categoria); setParcerias(resultado); } return { parcerias, carregaParcerias };
No entando, o componente Categorias precisa filtrar as parcerias pela categoria. Deixei assim:
const [ filtraParcerias ] = useParcerias(); ... <TouchableOpacity style={estilos.categoria} onPress={() => carregaParcerias(item.categoria)}> <Text>{item.categoria}</Text> </TouchableOpacity> ...
Só que aí quando clico na categoria não acontece nada em Cards, e se em Cards eu deixo assim:
useEffect( () => { const carregaCategorias = async () => { const resultado = await buscaCategorias() setCategorias(resultado) } carregaCategorias(); carregaParcerias(); }, [parcerias])
Aí entra em loop.
Código do buscaParcerias:
import api from "../api"; export async function buscaParcerias(categoria) { try { let resultado = [] if (categoria){ resultado = await api.get(''/parcerias?tag=''); } else { resultado = await api.get(''/parcerias''); } return resultado.data } catch (error) { console.log(error) return [] } }
Cesar Murilo
Curtir tópico
+ 0
Responder
Posts
Clique aqui para fazer login e interagir na Comunidade :)