Sticky 组件
优质
小牛编辑
129浏览
2023-12-01
1.10.0 新增
吸附组件,当滚动位置到达目标元素位置后,目标元素就会自动吸附。
示例
综合使用 - Scroll
<cube-sticky :pos="scrollY"> <cube-scroll :scroll-events="scrollEvents" @scroll="scrollHandler"> <ul> <li>title</li> </ul> <cube-sticky-ele ele-key="11"> <ul class="sticky-header"> <li>111</li> </ul> </cube-sticky-ele> <ul> <li v-for="item in items">{{item}}</li> </ul> <cube-sticky-ele ele-key="22"> <ul class="sticky-header"> <li>222</li> <li>222</li> </ul> </cube-sticky-ele> <ul> <li v-for="item in items2">{{item}}</li> </ul> <cube-sticky-ele ele-key="33"> <ul class="sticky-header"> <li>333</li> </ul> </cube-sticky-ele> <ul> <li v-for="item in items3">{{item}}</li> </ul> </cube-scroll> <template slot="fixed" slot-scope="props"> <ul class="sticky-header"> <li>{{props.current}}</li> </ul> </template> </cube-sticky>
const _data = [ '