ナビゲーション バーの固定位置を反応させます

 まず、react-sticky プラグインを使用します 

まずダウンロードしてください 

npm i -S react-sticky

 2 番目のステップは、使用する場所を紹介することです

 


これはエフェクトの画像です。ナビゲーション バーを引くと常に上部に表示されます。

 

 antd コンポーネントを使用したため、 renderTaBar = (props とデフォルトのスタイル) を記述して修正しました。

 ここでは前に紹介したスティッキーを使用し、bottomOffsettopOffset={80} のどちらを有効にするかを記述し、デフォルトの antd スタイルであるスタイルを記述し、独自のスタイルを追加します。

 4番目のステップ

先ほど紹介した StickyContainer タグを使って貼り付けたい内容をラップし、その第 1 レベルの子に先ほど書いた 3 番目のステップを追加すると成功します。

 

 

おすすめ

転載: blog.csdn.net/it_varlue/article/details/120593729