无法在我的反应本机应用程序中清理订阅

Question

在我的 react 本机应用程序中，我在 useEffect 挂钩中订阅了 CartProduct 数据模型，并使用返回函数取消了在组件卸载时应该运行的订阅。但这似乎不起作用，因为当我从另一个屏幕更改 CartProduct 模型时，我可以在控制台中看到 getCartProduct() 运行。如何解决这个问题？

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()
         
    }, []);

Answer 1

您是否尝试用粗箭头函数包装 useEffect cb？

  useEffect(() => {
    
    const subscription = DataStore.observe(CartProduct, d=>d.userID("eq", currentUserId)).subscribe(msg =>
     getCartProduct(),
    );
    return ()=> {
     console.log("unsubscribe -> ")
     subscription.unsubscribe()
    };
   }, []);