如何解决js-cookie不保存购物车数据ReactJS和Redux

问题描述

嘿,所以我很乐意将用户购物车数据信息保存在购物车中,以便满足页面重新加载的要求,使用户使用的购物车中的购物车数据仍然保持原样,我尝试实现,但即使刷新购物车信息也会刷新并将第一个输入的数据放入购物车 我能在解决问题上获得帮助吗?

以下代码由cartAction.js

const addToCart = (productId,qty) => async (dispatch,getState) => {
  try {
    const femaleProduct_url = `http://127.0.0.1:5000/single-womens-clothes/${productId}`;
    const maleProduct_url = `http://127.0.0.1:5000/single-mens-clothes/${productId}`;
    const kidsProduct_url = `http://127.0.0.1:5000/single-kids-clothes/${productId}`;

    const femaleProduct_request = await axios.get(femaleProduct_url);
    const maleProudct_request = await axios.get(maleProduct_url);
    const kidsProduct_request = await axios.get(kidsProduct_url);
    let data = [];

    axios
      .all([femaleProduct_request,maleProudct_request,kidsProduct_request])
      .then(
        axios.spread((...responses) => {
          const f_product = responses[0];
          const m_product = responses[1];
          const k_product = responses[2];

          if (f_product.data.length > 0) {
            data = f_product.data;
          } else if (m_product.data.length > 0) {
            data = m_product.data;
          } else {
            data = k_product.data;
          }
        })
      )
      .then((response) => {
        console.log(data[0].productName);
        dispatch({
          type: ADD_TO_CART,payload: {
            productId: data[0]._id,name: data[0].productName,image: data[0].productimage,price: data[0].productPrice,Qty: qty,},});

        //This is where I tried to set the cart data to the user's cookie
        const {
          cart: { cartItems },} = getState();
        Cookie.set("cartItems",JSON.stringify(cartItems));

下面的代码是store.js,在其中我通过获取Actions.js中所述的cookie数据来设置状态的初始状态。

const cart = Cookie.getJSON("cartItems" || []);
const initialState = { cartItems: cart };
const reducer = combineReducers({
  femaleClothesList: femaleProductListReducer,maleClothesList: maleProductListReducer,kidsClothesList: kidsProductListReducer,cart: cartReducer,});

请问我可以解决此问题吗

解决方法

暂无找到可以解决该程序问题的有效方法,小编努力寻找整理中!

如果你已经找到好的解决方法,欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@)