git原文:https://github.com/captivationsoftware/react-sticky
NPM:
# npm install react-sticky
import React from 'react';
import { StickyContainer, Sticky } from 'react-sticky';
<StickyContainer>
<Sticky>
{({
style,
isSticky,
wasSticky,
distanceFromTop,
distanceFromBottom,
calculatedHeight
}) => (
<div
style={{
...style,
zIndex: 3,
backgroundColor: '#5890ff'
color: 'white',
padding: '2px 0'
}}
><span style={{paddingLeft: '5px' }}></span>
设备状态:: '离线中'
</div>
)}
</Sticky>
{/* Sticky 为悬浮框 */}
<div className={styles.bodyBox}>
{/* content body */}
</div>
</StickyContainer>
注:StickyContainer 需要包裹所有内容