Next.js 条件付きスタイル
P粉596161915
P粉596161915 2023-08-10 16:17:51
0
1
591
<pre class="brush:php;toolbar:false;"><p>パスがリンクの href と一致する場合にリンクを有効にしたいと考えています。 </p> <pre><code> 関数 Component() { const パス名 = usePathname(); 戻る ( <div className="リンク"> <Link href="/">ホームページ</Link> <Link href="/store" className={`${pathname === this.href && "active"}`} >store</Link> <Link href="/actors">アクター</Link> </div> ) }</code></pre> <コード> <p>これを試してみましたが、残念ながらうまくいきませんでした。このようなことはできますか? </p></code></pre>
P粉596161915
P粉596161915

全員に返信(1)
P粉432930081

クラス コンポーネント内でのみアクセスできる機能コンポーネントでは this を使用できません。望む効果を実現するには、コードを手動で記述するだけです。例:

リーリー

また、className で && を使用しないように注意してください。条件が true でない場合、className に false が追加されるため、条件が true の場合は三項演算子を使用して "" を追加できます。間違い 。

いいねを押す +0
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート