当前位置: 首页 > news >正文

Uniapp或者微信小程序如何动态的计算Scrollview的高度

当一个小程序页面,顶部有搜索栏,或者分类查询时,我们想要保证它们能固定到顶部,就需要使用到Scrollview,那么如何确定Scrollview就是一个问题,这时我们可以使用以下代码来实现

setScrollHeight(view = '#scrollView', name = 'scrollHeight') {let that = thisuni.getSystemInfo({success: function(res) {const query = uni.createSelectorQuery().in(that).select(view);query.boundingClientRect(data => {that[name] = res.windowHeight - data.top}).exec();}});
},

先获取Scrollview距离顶部的高度,然后页面高度减去顶部距离,就能得到剩余的内容高度,如果底部还有操作条,那么我们再减去其高度,就能得到具体的Scrollview高度了

注意点是为了能准确的获取到页面元素,从而准确计算高度,我们需要将代码放到onReady生命周期里运行

onReady() {this.setScrollHeight()
},

相关文章:

Uniapp或者微信小程序如何动态的计算Scrollview的高度

当一个小程序页面,顶部有搜索栏,或者分类查询时,我们想要保证它们能固定到顶部,就需要使用到Scrollview,那么如何确定Scrollview就是一个问题,这时我们可以使用以下代码来实现 setScrollHeight(view #scr…...

Abase数据库管理系统

Abase数据库管理系统的架构介绍如下: 1. 概述 Abase是一个开源的分布式数据库中间件,实现MySQL数据库的自动扩缩容、故障转移和查询路由。 2. 功能架构 - 读写分离:拆分为主从两套服务 - 自动扩缩容:根据负载水平完成扩容 - 负载均衡:基于查询解析的路由 - 故障转移:快速切换…...

系统架构设计高级技能 · 大数据架构设计理论与实践

系列文章目录 系统架构设计高级技能 软件架构概念、架构风格、ABSD、架构复用、DSSA(一)【系统架构设计师】 系统架构设计高级技能 系统质量属性与架构评估(二)【系统架构设计师】 系统架构设计高级技能 软件可靠性分析与设计…...

ubuntu上使用osg3.2+osgearth2.9

一、介绍 在ubuntu上使用osgearth加载三维数字地球,首先要有osg和osgearth的库,这些可以直接使用apt-get下载安装,但是版本有些老,如果需要新版本的就需要自己编译。 #查看现有版本 sudo apt-cache madison openscenegraph #安装…...

C语言巧妙打印64位整数

使用C语言打印64位整数时,如果用的是32位编译器,那么打印如下, int64_t data 0x1234567890123456; printf("0x%llx\n", data);如果是64位编译器,那么打印代码如下, int64_t data 0x1234567890123456; pr…...

c语言每日一练(11)

前言:每日一练系列,每一期都包含5道选择题,2道编程题,博主会尽可能详细地进行讲解,令初学者也能听的清晰。每日一练系列会持续更新,暑假时三天之内必有一更,到了开学之后,将看学业情…...

SLAM十四讲学习笔记 第二期:部分课后实践代码

持续更新.... 前期准备第二讲实验一:简单输出 第五讲任务一:imageBasics(Ubuntu配置opencv)任务二:双目匹配点云(Ubuntu配置pangolin)检验部分我认为可以加深对CMake的理解 任务三:r…...

Android kotlin 跳转手机热点开关页面和判断热点是否打开

Android kotlin 跳转手机热点开关页面和判断热点是否打开 判断热点是否打开跳转手机热点开关页面顺带介绍一些其他常用的设置页面跳转 其他热点的一些相关知识Local-only hotspot 参考 判断热点是否打开 网上方法比较多,我这边使用了通过WifiManager 拿反射的getWi…...

Redis 执行 RDB 快照期间,主进程可以正常处理命令吗?

执行了 save 命令,会在主进程生成 RDB 文件,由于和执行操作命令在同一个线程,所以如果写入 RDB 文件的时间太长,会阻塞主进程。 执行 bgsave 过程中,由于是交给子进程来构建 RDB 文件,主进程还是可以继续工…...

Python加入Excel--生产力大提高|微软的全方面办公

Python作为一种功能强大的编程语言,已经逐渐成为了数据分析、机器学习、Web开发等领域的主流语言之一。而将Python集成到Excel中,则可以为Excel用户提供更加强大的数据处理和分析能力,同时也可以为Python开发者提供更加便捷的数据处理和可视化…...

Excel 分组排名

分组排名 公式&#xff1a;SUMPRODUCT((A:AA2)*(C:C>C2)) 1 降序&#xff1a;> 改为 < ⚠️注意1&#xff1a;此处空值参与排名&#xff1b;不参与排名则公式改为&#xff1a;IF(C2“”,“”,SUMPRODUCT((A:AA2)*(C:C>C2)) 1) ⚠️注意2&#xff1a;相同值的项…...

Redis初始以及安装

"梦却了无影踪&#xff0c;梦仍不曾改动" 初始Redis (1) Redis是什么&#xff1f; 要认识、学习一个软件&#xff0c;最重要的途径无一是去该软件的官方文档里瞅瞅、转悠转悠。 从官方文档的介绍中得知&#xff0c;Redis是一种工作于内存&#xff0c;…...

react导出、导入文件

导出文件&#xff1a; if (res) {let binaryData [];binaryData.push(res);let blobUrl ;blobUrl res;// let blobUrl window.URL.createObjectURL(new Blob(binaryData, { type: application / zip }));console.log(blobUrl);const eleLink document.createElement(a);el…...

(一)Redis——String

以下是在Ubuntu上安装Redis的步骤&#xff1a; 打开终端并输入以下命令以更新软件包列表&#xff1a;sudo apt update输入以下命令以安装Redis&#xff1a;sudo apt install redis-server SET key value GET key key & value 区分大小写 127.0.0.1:6379> set name no…...

Spring Boot多环境指定yml或者properties

Spring Boot多环境指定yml或者properties 文章目录 Spring Boot多环境指定yml或者properties加载顺序配置指定某个yml 加载顺序 ● application-local.properties ● application.properties ● application-local.yml ● application.yml application.propertes server.port…...

MinDoc:针对IT团队的文档、笔记系统

作为一名IT从业者&#xff0c;无论是在公司团队中&#xff0c;还是在平时自己写一些笔记、博客等文档&#xff0c;我都习惯使用markdown来进行书写。在使用过许多支持markdown语法的系统或软件&#xff08;如Typora、未知、我来、思源、觅道等&#xff09;后&#xff0c;我总觉…...

【分享】华为设备登录安全配置案例

微思网络www.xmws.cn&#xff0c;2002年成立&#xff0c;专业IT认证培训21年&#xff0c;面向全国招生&#xff01; 微 信 号 咨 询&#xff1a; xmws-IT 华为HCIA试听课程&#xff1a;超级实用&#xff0c;华为VRP系统文件详解【视频教学】华为VRP系统文件详解 华为HCIA试听课…...

Starrocks与MySQL函数的区别

Starrocks与MySQL函数的区别 Starrocks是一款分布式OLAP数据库&#xff0c;而MySQL则是一种关系型数据库。由于其不同的架构和用途&#xff0c;它们在支持的函数方面存在一些差异。下面将详细介绍Starrocks和MySQL之间常见函数的区别。 1. 聚合函数&#xff08;Aggregate Fun…...

【HTML】学习笔记(自用持续更新)

HTML基本框架 只定义信息&#xff0c;通过标签组成整个页面框架&#xff0c;再通过CSS渲染使得前端页面做的好看 <!DOCTYPE HTML> \\html类型 <html><body><h1>这是一个标题</h1><p>这是一段文字</p></body> </html> …...

代码随想录训练营第四十二天|0-1背包理论基础(一)、0-1背包理论基础(二)、416分割等和子集

0-1背包理论基础(一) 文章讲解/视频链接&#xff1a;代码随想录 小节&#xff1a;本节课讲得是0-1背包的二维数组解法&#xff0c;dp[i][j]的含义是从物品0-i中不重复的拿出可以装进容量为j的背包的最大价值的物品&#xff0c;状态转移公式为&#xff0c;dp[i][j] max(dp[i - …...

JavaSec-RCE

简介 RCE(Remote Code Execution)&#xff0c;可以分为:命令注入(Command Injection)、代码注入(Code Injection) 代码注入 1.漏洞场景&#xff1a;Groovy代码注入 Groovy是一种基于JVM的动态语言&#xff0c;语法简洁&#xff0c;支持闭包、动态类型和Java互操作性&#xff0c…...

基于当前项目通过npm包形式暴露公共组件

1.package.sjon文件配置 其中xh-flowable就是暴露出去的npm包名 2.创建tpyes文件夹&#xff0c;并新增内容 3.创建package文件夹...

el-switch文字内置

el-switch文字内置 效果 vue <div style"color:#ffffff;font-size:14px;float:left;margin-bottom:5px;margin-right:5px;">自动加载</div> <el-switch v-model"value" active-color"#3E99FB" inactive-color"#DCDFE6"…...

html-<abbr> 缩写或首字母缩略词

定义与作用 <abbr> 标签用于表示缩写或首字母缩略词&#xff0c;它可以帮助用户更好地理解缩写的含义&#xff0c;尤其是对于那些不熟悉该缩写的用户。 title 属性的内容提供了缩写的详细说明。当用户将鼠标悬停在缩写上时&#xff0c;会显示一个提示框。 示例&#x…...

学校时钟系统,标准考场时钟系统,AI亮相2025高考,赛思时钟系统为教育公平筑起“精准防线”

2025年#高考 将在近日拉开帷幕&#xff0c;#AI 监考一度冲上热搜。当AI深度融入高考&#xff0c;#时间同步 不再是辅助功能&#xff0c;而是决定AI监考系统成败的“生命线”。 AI亮相2025高考&#xff0c;40种异常行为0.5秒精准识别 2025年高考即将拉开帷幕&#xff0c;江西、…...

SAP学习笔记 - 开发26 - 前端Fiori开发 OData V2 和 V4 的差异 (Deepseek整理)

上一章用到了V2 的概念&#xff0c;其实 Fiori当中还有 V4&#xff0c;咱们这一章来总结一下 V2 和 V4。 SAP学习笔记 - 开发25 - 前端Fiori开发 Remote OData Service(使用远端Odata服务)&#xff0c;代理中间件&#xff08;ui5-middleware-simpleproxy&#xff09;-CSDN博客…...

回溯算法学习

一、电话号码的字母组合 import java.util.ArrayList; import java.util.List;import javax.management.loading.PrivateClassLoader;public class letterCombinations {private static final String[] KEYPAD {"", //0"", //1"abc", //2"…...

Netty从入门到进阶(二)

二、Netty入门 1. 概述 1.1 Netty是什么 Netty is an asynchronous event-driven network application framework for rapid development of maintainable high performance protocol servers & clients. Netty是一个异步的、基于事件驱动的网络应用框架&#xff0c;用于…...

SQL慢可能是触发了ring buffer

简介 最近在进行 postgresql 性能排查的时候,发现 PG 在某一个时间并行执行的 SQL 变得特别慢。最后通过监控监观察到并行发起得时间 buffers_alloc 就急速上升,且低水位伴随在整个慢 SQL,一直是 buferIO 的等待事件,此时也没有其他会话的争抢。SQL 虽然不是高效 SQL ,但…...

AirSim/Cosys-AirSim 游戏开发(四)外部固定位置监控相机

这个博客介绍了如何通过 settings.json 文件添加一个无人机外的 固定位置监控相机&#xff0c;因为在使用过程中发现 Airsim 对外部监控相机的描述模糊&#xff0c;而 Cosys-Airsim 在官方文档中没有提供外部监控相机设置&#xff0c;最后在源码示例中找到了&#xff0c;所以感…...