ホームページ  >  に質問  >  本文

useEffect を使用して背景色の状態を維持するためのヒント

<p>ウィッシュリストのトグル ボタンの背景色を保存しようとしています。これにより、ユーザーがページ間を移動しても、ボタンの色は「黒」のままになり、項目がウィッシュリストに保存されたことがユーザーに示されます。 </p> <pre class="brush:php;toolbar:false;">const item = (props) => { const ディスパッチ = useDispatch(); const [背景、setBackground] = useState(false); function addToCartHandler(product) { ディスパッチ(カートに追加(製品)); } 関数 toggleWishlistHandler(product) { ディスパッチ(toggleItem(製品)); setBackground((現在) => !現在); } 戻る ( <div> <li className={classes.item}> <img src={props.img} alt="Item" className={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}>
<i className="fa-solid fa-heart"></i> </div>
<i className="fa-solid fa-bag-shopping"<</i> </div> </div> </li> </div> ); }; デフォルト項目をエクスポート;</pre>
P粉131455722P粉131455722451日前479

全員に返信(1)返信します

  • P粉642919823

    P粉6429198232023-08-19 00:09:28

    色をローカル ストレージに保存できます。

    リーリー

    返事
    0
  • キャンセル返事