<p>Saya cuba menyimpan warna latar belakang butang togol senarai hajat supaya apabila pengguna bergerak melintasi halaman, warna butang itu kekal "hitam" untuk menunjukkan kepada pengguna bahawa mereka telah menyimpan item itu ke senarai hajat. </p> <pre class="brush:php;toolbar:false;">const Item = (props) => const dispatch = useDispatch(); const [latar belakang, setBackground] = useState(false); fungsi addToCartHandler(produk) { dispatch(addToCart(product)); } function toggleWishlistHandler(product) { dispatch(toggleItem(product)); setBackground((semasa) => !semasa); } kembali ( <div> <li className={classes.item}> <img src={props.img} alt="Item"Nama kelas={classes.image} /> <div className={classes.description}> <p className={classes.title}>{props.title}</p> <p className={classes.price}>£{props.price}.00</p> </div> <div className={classes.actions}> <div className={`${classes.addWishlist} ${classes.icon}`} onClick={() => toggleWishlistHandler(props.product)} gaya={{ warna latar belakang: "hitam" }} > <i className="fa-solid fa-heart"></i> </div> <div className={`${classes.addCart} ${classes.icon}`} onClick={() => addToCartHandler(props.product)} > <i className="fa-pepejal-beg-belanja"></i> </div> </div> </li> </div> ); }; eksport Item lalai;</pra>

// 检查是否设置为黑色
  const [background, setBackground] = useState(localStorage.getItem('wishlistBackground') === 'black');


// 每当背景颜色发生变化时，将其保存到本地存储中
  useEffect(() => {
    localStorage.setItem('wishlistBackground', background ? 'black' : 'orange');
  }, [background]);