Taro中使用ScrollView的那些事
创始人
2024-04-14 20:52:19
0

开发场景:h5嵌入app webview 

Taro:3.x

1、是否需要给ScrollView高度(Taro官网给的描述:H5 中 ScrollView 组件是通过一个高度(或宽度)固定的容器内部滚动来实现的,因此务必正确的设置容器的高度)

        1)可以不给 单纯给一个页面堆填元素展示 只是为了页面滚动(其实不用这个组件都ok 浏览器窗口自带滚动功能)主要考虑后续会使用的一些ScrollView的方法

        2)给height 这个就根据你的场景给了 一般也就是100vh

2、Scrollview的方法不生效

        需要给Scrollview这个组件固定的高度 不给固定高度情况下滑动触发的是body的滑动

3、ScrollView的方法生效了 但是滑动到一定距离会失效

        在基于2的解决方案上 ScrollView组件的高度 要<=可视窗口的高度 超出窗口距离再往下滑动情况 会触发body的滑动 ScrollView的滑动事件会失效


基本业务场景:

1、单纯长列表数据 实现上拉刷新下拉加载 100vh基本可以覆盖

2、长列表数据独立于ScrollView这个组件平级有一个固定展示的dom 或者底部有一个固定悬浮的按钮 这时候100vh就需要减去合适的高度在给到ScrollView 否则就会导致触发错误的滑动事件 以及列表底部部份数据无法滑动展现

3、嵌入app还需要考虑相关机型的安全区域高度对于ScrollView高度的影响(因为当前开发功能不是使用webview的导航 而是h5自己写的)

相关内容

热门资讯

监控摄像头接入GB28181平... 流程简介将监控摄像头的视频在网站和APP中直播,要解决的几个问题是:1&...
Windows10添加群晖磁盘... 在使用群晖NAS时,我们需要通过本地映射的方式把NAS映射成本地的一块磁盘使用。 通过...
protocol buffer... 目录 目录 什么是protocol buffer 1.protobuf 1.1安装  1.2使用...
在Word、WPS中插入AxM... 引言 我最近需要写一些文章,在排版时发现AxMath插入的公式竟然会导致行间距异常&#...
【PdgCntEditor】解... 一、问题背景 大部分的图书对应的PDF,目录中的页码并非PDF中直接索引的页码...
Fluent中创建监测点 1 概述某些仿真问题,需要创建监测点,用于获取空间定点的数据࿰...
educoder数据结构与算法...                                                   ...
MySQL下载和安装(Wind... 前言:刚换了一台电脑,里面所有东西都需要重新配置,习惯了所...
MFC文件操作  MFC提供了一个文件操作的基类CFile,这个类提供了一个没有缓存的二进制格式的磁盘...
有效的括号 一、题目 给定一个只包括 '(',')','{','}'...