Let the navigation bar sticky positioning in react

 First use the react-sticky plugin 

download first 

npm i -S react-sticky

 The second step is to introduce where we want to use

 


This is the rendering, the navigation bar is always on the top when you pull

 

 Because I used the antd component, I wrote renderTaBar = (props, and the default style) and then modified

 The sticky introduced before is used here and then write whether you want bottomOffset or topOffset={80} to take effect, and then write the style, which is the default antd style and add your own style. The third step is OK

 the fourth step

Use the StickyContainer tag introduced earlier to wrap the content you want to stick, and add the third step we wrote just now to its first-level child, and it will be successful.

 

 

Guess you like

Origin blog.csdn.net/it_varlue/article/details/120593729