たくさんのバスケットボール チームをまとめたサイドナビゲーションがあります。チームごとに異なるものを表示したいのですが、そのうちの 1 つにマウスを移動させたときに表示したいです。また、Reactjs を使用しているので、別のコンポーネントに渡すことができる変数があれば最高です。
ベストアンサー1
React コンポーネントは、トップレベルのインターフェースですべての標準 Javascript マウス イベントを公開します。もちろん、CSS で を使用することもできますし、一部のニーズにはこれで十分かもしれませんが、ホバーによってトリガーされるより高度な動作には、Javascript を使用する必要があります。したがって、ホバー インタラクションを管理するには、と を:hover使用する必要があります。次に、次のようにコンポーネントのハンドラーに をアタッチします。onMouseEnteronMouseLeave
<ReactComponent
onMouseEnter={() => this.someHandler}
onMouseLeave={() => this.someOtherHandler}
/>
次に、状態とプロパティの組み合わせを使用して、変更された状態またはプロパティを子 React コンポーネントに渡します。