小编Ben*_*min的帖子

NextJS localStorage 和购物车上下文

我正在开发一个购物车系统,问题是,当我将产品添加到购物车时,它在上下文和本地存储中工作;但是,当我刷新时,数据就消失了。

export const DataContext = createContext();

export const DataProvider = ({ children }) => {
  const [cart, setCart] = useState([]);
  const [state, dispatch] = useReducer(AppReducer, cart);

  useEffect(() => {
    const cartData = JSON.parse(localStorage.getItem("cart"));
    if (cartData) {
      setCart(cartData);
    }
  }, []);

  useEffect(() => {
    localStorage.setItem("cart", JSON.stringify(cart));

    // Cookies.set("cart", cart, { expires: 1 / 24 });
    // let products = Cookies.get("cart");
    // console.log(products);
  }, [cart]);

  const addToCart = (newProduct) => {
    setCart((prev) => [...prev, newProduct]);
  };

  return (
    <DataContext.Provider value={{ cart, setCart, …
Run Code Online (Sandbox Code Playgroud)

local-storage next.js react-context

0
推荐指数
1
解决办法
4363
查看次数

标签 统计

local-storage ×1

next.js ×1

react-context ×1