# WVPage
# 示例
import {
WVPage
} from '@wjh666/mp-w-vant-ui/common/wxPage.js'
WVPage({
data: {
// 每一行div高度(预计,最终会动态获取)
SCROLLDATAitemHeight: 30,
// 总长度(总共有几个div)
SCROLLDATALength: 0
},
onLoad() {}
})
// 根据页面实际位置寻找
<wxs src="../../components/wxs/wv.wxs" module="wv" />
<view class="scroll">
<view
wx:for="{{list}}"
wx:key="index"
wx-if="{{ wv.scrollIf(SCROLLDATA, index) }}"
style="{{ wv.scrollTop(SCROLLDATAStyle, index) }}"
class="scroll_item_text scroll_item {{ 'scroll_item' + index }}"
>
{{ item.text }}
</view>
<!-- 占位元素 -->
<view
class="scroll_perch"
style="height: {{ SCROLLDATA.totalHeight }}px;"
>
</view>
</view>
.scroll{
position: relative;
}
.scroll_perch{
position: absolute;
top: 0;
left: -2px;
width: 1px;
}
.scroll_item{
position: absolute;
left: 0;
width: 100%;
}
# 实现思路
通过对小程序页面进行劫持,劫持每次setData更新后与滚动的方法
动态计算要展示哪些dom元素,其他进行隐藏