En mi aplicación nativa de reacción, me suscribí al modelo de datos de CartProduct dentro del enlace useEffect y usando una función de devolución, cancelé la suscripción que debería ejecutarse cuando el componente se desmonta. Pero esto no parece funcionar porque cuando cambio el modelo CartProduct desde una pantalla diferente, puedo ver en la consola que se ejecuta getCartProduct(). ¿Cómo arreglar esto?

 const[cartProducts, setcartProducts] = useState <CartProduct[]>([]); const currentUserId = "28ab9cfc-6f0e-4cb4-9ac8-c875aecc7" const getCartProduct = async () => { await DataStore.query(CartProduct, c=>c.userID("eq", currentUserId)).then(setcartProducts); console.log("fetching!") }; useEffect(() => { const subscription = DataStore.observe(CartProduct, d=>d.userID("eq", currentUserId)).subscribe(msg => getCartProduct(), ); return subscription.unsubscribe; }, []); useEffect(() => { getCartProduct() }, []);