Skip to content

Commit

Permalink
Update virtual-list-demo.vue
Browse files Browse the repository at this point in the history
  • Loading branch information
SmileZXLee committed Sep 21, 2024
1 parent 910ae19 commit be4bd46
Showing 1 changed file with 4 additions and 7 deletions.
11 changes: 4 additions & 7 deletions demo/z-paging-demo/pages/virtual-list-demo/virtual-list-demo.vue
Original file line number Diff line number Diff line change
Expand Up @@ -9,14 +9,11 @@
<!-- 如果页面中的cell高度是固定不变的,则不需要设置cell-height-mode,如果页面中高度是动态改变的,则设置cell-height-mode="dynamic" -->
<z-paging ref="paging" use-virtual-list :cell-height-mode="tabIndex===0?'fixed':'dynamic'" @query="queryList" @virtualTopHeightChange="virtualTopHeightChange">
<!-- 需要固定在顶部不滚动的view放在slot="top"的view中,如果需要跟着滚动,则不要设置slot="top" -->
<view class="banner-view" style="height: 250rpx;">
<view style="font-size: 40rpx;font-weight: 700;">这是一个banner</view>
<view style="font-size: 24rpx;margin-top: 5rpx;">下方tab滚动时可吸附在顶部</view>
</view>
<view style="z-index: 100;position: sticky;" :style="[{top:-topHeight + 'px'}]">
<template #top>
<view class="header">列表总数据量:10万条</view>
<!-- 注意!此处的z-tabs为独立的组件,可替换为第三方的tabs,若需要使用z-tabs,请在插件市场搜索z-tabs并引入,否则会报插件找不到的错误 -->
<z-tabs :list="tabList" @change="tabChange" />
</view>
<z-tabs :list="tabList" @change="tabsChange" />
</template>
<!-- 如果希望其他view跟着页面滚动,可以放在z-paging标签内,放在所有cell上方的用slot="header"插入,放在所有cell下方的用slot="footer"插入 -->

<!-- 通过slot="cell"插入列表for循环的cell,slot-scope中提供当前for循环的item和index -->
Expand Down

0 comments on commit be4bd46

Please sign in to comment.