react を使用してコレクション関数を実装する方法: クリックして逆の iconStatus を設定して収集します。コードは [const [icoStatus, setIcoStatus] = useState(true)] です。
react を使用してコレクション関数を実装する方法:
1. iconStatus 反転を設定してクリックして収集します。 , お気に入りを解除する機能
import React,{useState} from 'react' function Model(){ const [icoStatus, setIcoStatus] = useState(true) //点击收藏按钮 const iconSouCangData = (event, props) => { setIcoStatus(!icoStatus) } return( <> <span className={icoStatus? " icon-soucang2 soucang-color" : "icon-soucang2"} onClick={(e) => icoStatusData(e,props)}></span> </> )}
2. 以下は循環リストを収集するためのものです. お気に入りを解除する
import React,{useState} from 'react' function Model(){ const [icoStatus, setIcoStatus] = useState(true) //点击收藏按钮 const iconSouCangData = (event, props) => { setIcoStatus(!icoStatus) } return( <> <span className={iconSouCang ? "opts-icon icon-soucang2 soucang-color" : "icon-hide"} onClick={(e) => iconSouCangData(e,props)}></span> <span className={iconSouCang ? "icon-hide" : "opts-icon icon-soucang"} onClick={(e) => iconSouCangData(e,props)}></span> </> )}
関連する無料学習の推奨事項: JavaScript (ビデオ )
以上がReactを使ったコレクション機能の実装方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。