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

方法一:使用uni.pageScrollTo 使页面纵向滚到到指定位置
复制代码
uni.pageScrollTo({
	scrollTop: 0,
	duration: 300
});

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

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

html

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 - 20
	   this.scrollLeft = left; // 设置滚动条距离左侧的距离    				        
   }).exec();
},
相关推荐
程序员海军6 小时前
用了两年多 GPT,我最近开始换模型了,还折腾了个求职避坑 Agent
前端·人工智能·后端
zttbee6 小时前
echarts图表tooltip色块失效
前端·javascript·echarts
excel8 小时前
IndexNow:让搜索引擎更快发现网站更新的主动通知协议
前端·后端·架构
子兮曰8 小时前
CSS 复现 23 种设计风格:从拟物到液态玻璃的成本阶梯与兜底写法【实战】
前端·css·视觉设计
虚无境8 小时前
如何用AI帮我写出实用的插件
前端·javascript·ai编程
柳杉9 小时前
从数字化到数智化:3D 可视化大屏的下一个五年
前端·ai编程·数据可视化
zimoyin9 小时前
在 C# 里嵌入 JavaScript:用 Jint 做可热更新的自动化脚本(从入门到踩坑)
javascript·c#·自动化
风骏时光牛马10 小时前
从零到实战:AI全栈学习进阶路线
前端
FRing0310 小时前
JavaScript入门到精通二十六(变量提升、函数剩余参数、展开运算符、ES6箭头函数)
开发语言·前端·javascript·es6·箭头函数
用户3600555790010 小时前
Kestrel_VLLM - 15 · decode 优化四连击:19ms → 8ms
前端