uniapp设置滚动条滚动到指定位置

场景：左侧菜单栏，每次切换时，需要右侧商品展示区保持滚动条及页面在最顶部

 

1.利用scroll-view 中scroll-top属性实现

1.1设置scrollToTop属性为0

data() {
	return {
		// 保证每次切换，滚动条位置都在最顶部
		scrollToTop: 0,
	};
}

1.2 菜单栏切换时clickFirstCategory切换scrollToTop的值

scrollToTop在0，1之间切换，通过1px的差别使页面可以正常渲染

			
				
					{{category.cat_name}}
				
			

clickFirstCategory(index) {	
	// 每次点击都保证scroll滚动条在最顶部
	this.scrollToTop = this.scrollToTop ? 0 : 1
},

...

2.使用uni.pageScrollTo()方法

3.uni.pageScrollTo()和scroll-view组件使用区别

1）使用 uni.pageScrollTo 方法，属于页面级别滚动。

如果传入 scrollTop 不起效，应该是布局的问题， 它是页面级的滚动：所有的 滚动单元 必须是在根元素下，由 滚动单元 直接撑起来的高度，就可以滚动到指定位置。
2）使用 scroll-view 标签的属性：scroll-top(距离值 num) 或 scroll-into-view(子元素的id,不能以数字开头 string); 属于区域级别滚动。
两种方式的前提是：提供具体的高度值

参考：uniapp 将元素滚动到指定位置的两种方法总结_uniapp滚动到指定元素的位置_铁锤妹妹@的博客-CSDN博客