uniapp 页面滚动到指定位置的方法

server/2024/10/21 3:31:22/
方法一:使用uni.pageScrollTo 使页面纵向滚到到指定位置
uni.pageScrollTo({scrollTop: 0,duration: 300
});

如果滚动无效,可以尝试将代码放在settimeOut(异步),或者nextTick(微任务)。若仍滚动无效,可以将html为外层的盒子高度设置为 height:auto!important;

方法二:使用<scroll-view>标签,可以将页面横向(或纵向)滚动到指定位置

html

<scroll-view scroll-x="true" class="scrollSku" :scroll-left="scrollLeft"><view v-for="(item,index) in data" :key="item.id" :id="'target'+index"></view>
</scroll-view>
changeScroll(index) {uni.createSelectorQuery().in(this).select('#target' + index).boundingClientRect(res => {let left = res.left < 0 ? res.left + 20 : res.left - 20this.scrollLeft = left; // 设置滚动条距离左侧的距离    				        }).exec();
},


http://www.ppmy.cn/server/12342.html

相关文章

Swift中与WebView的交互

在Swift中&#xff0c;可以使用WKWebView来实现与WebView的交互。WKWebView是iOS 8及以后版本中新增的Web视图控件&#xff0c;它提供了一种现代化的方式来加载和显示Web内容&#xff0c;并且支持与JavaScript的交互。 以下是一些常见的与WebView的交互方式&#xff1a; 1.加…

使用 Flutter 打造引人入胜的休闲游戏体验

作者 / Zoey Fan 去年&#xff0c;Flutter 休闲游戏工具包进行了一次重大更新。近期在旧金山举办的游戏开发者大会 (GDC) 上&#xff0c;Flutter 首次亮相。GDC 是游戏行业的顶级专业盛会&#xff0c;致力于帮助游戏开发者不断提升开发技能。欢迎您继续阅读&#xff0c;了解开发…

GPT 在目标设定中的应用:实现梦想的技术方法

在技术快速进步的时代&#xff0c;我们设定和实现目标的方式正在不断发展。 该领域最重要的创新之一是引入生成式预训练 Transformer (GPT)。 本文将探讨 GPT 技术如何彻底改变目标设定的艺术&#xff0c;提供实用的见解和案例研究来展示其影响。 GPT 和目标设定简介 ​ 了解 …

代码随想录算法训练营第7天 | 454. 四数相加 II | 383. 赎金信 | 15. 三数之和 | 18. 四数之和

454. 四数相加 II 题意 找出四个数组中元素和为0的次数 解 class Solution { public:int fourSumCount(vector<int>& nums1, vector<int>& nums2, vector<int>& nums3, vector<int>& nums4) {unordered_map<int, int> map;i…

JAVA:maven-->>检查 所有依赖 与 环境 兼容

为了确保你项目中的所有依赖都彼此兼容&#xff0c;并与你的环境相适应&#xff0c;你可以利用 Maven 的依赖管理功能。Maven 有助于解决、升级&#xff0c;并对齐所有库的版本&#xff0c;以避免任何不一致或冲突。以下是检查兼容性的步骤&#xff1a; ### 检查兼容性的步骤&…

文件上传的复习(upload-labs1-5关)

什么是文件上传漏洞&#xff1f; 文件上传本身是一个正常的业务需求&#xff0c;对于网站来说&#xff0c;很多时候也确实需要用户将文件上传到服务器&#xff0c;比如&#xff1a;上传图片&#xff0c;资料。 文件上传漏洞不仅涉及上传漏洞这个行为&#xff0c;还涉及文件上…

MemFire解决方案-政企数据库云服务解决方案

方案背景 随着越来越多的政府部门/企事业单位完成数字化转型升级&#xff0c;新技术的应用日益普遍&#xff0c;对系统并发服务能力的需求不断提高。办公OA、档案、门户、监控、财务、ERP、订单等各类系统对数据库的要求越来越苛刻&#xff0c;很多企业/政府部门都面临如下挑战…

使用 IPAM 解决方案简化分布式网络管理

随着组织在数字领域的全球扩张&#xff0c;分布式网络是不可避免的&#xff0c;这意味着&#xff0c;随着 IT 基础设施的发展&#xff0c;组织需要适应&#xff0c;这包括在不断增长的系统需求、应用程序堆栈、各种协议和安全防御中监控、现代化和简化流程和资源。在有效管理现…