ERROR
undefined is not iterable (cannot read property Symbol(Symbol.iterator))
TypeError: undefined is not iterable (cannot read property Symbol(Symbol.iterator))
at Header (http://localhost:3000/static/js/bundle.js:400:18)
at renderWithHooks (http://localhost:3000/static/js/bundle.js:35333:22)
at mountIndeterminateComponent (http://localhost:3000/static/js/bundle.js:38619:17)
This is my header.js
import React from "react";
import "./Header.css";
import ShoppingBasketIcon from "@mui/icons-material/ShoppingBasket";
import StorefrontIcon from "@mui/icons-material/Storefront";
import SearchIcon from "@mui/icons-material/Search";
import { Link } from "react-router-dom";
import { useStateValue } from "./StateProvider";
function Header() {
const [{ basket }, dispatch] = useStateValue();
return (
<div className="header">
<Link to="/" style={{ textDecoration: "none" }}>
<div className="header_logo">
<StorefrontIcon className="header_logoImage" fontSize="large" />
<h2 className="header_logoTitle">eShop</h2>
</div>
</Link>
<div className="header_search">
<input type="text" className="header_searchInput" />
<SearchIcon className="header_searchIcon" />
</div>
<div className="header_nav">
<div className="nav_item">
<span className="nav_itemLineOne">Hello Guest</span>
<span className="nav_itemLineTwo">Sign In</span>
</div>
<div className="nav_item">
<span className="nav_itemLineOne">Your</span>
<span className="nav_itemLineTwo">Shop</span>
</div>
<Link to="/checkout" style={{ textDecoration: "none" }}>
<div className="nav_itemBasket">
<ShoppingBasketIcon />
<span className="nav_iteminTwo nav_basketCount">
{basket.length}
</span>
</div>
</Link>
</div>
</div>
);
}
export default Header;
I’ve tried to install the latest versions of react-dom and etc, cause I’m watchin a tutorial how to create an amazon-clone and I did the same things like in tutorial, but my code doesn’t work