uniapp怎么跳转到页面指定位置
在开发uniapp应用过程中，经常需要跳转到页面指定位置。这在一些长页面中，比如商品详情页、文章详情页等中非常常见。
1. 使用scroll-view组件实现
在uniapp中，可以使用scroll-view组件实现跳转到页面指定位置。scroll-view组件可以实现滚动，它包含一个或多个scroll-view-content组件，scroll-view-content组件是滚动内容的容器。
要实现跳转到页面指定位置，首先需要在scroll-view组件中设置id属性，然后通过uni.pageScrollTo方法实现滚动跳转。uni.pageScrollTo方法接收一个对象作为参数，其中scrollTop属性设置滚动的位置，单位为px。
// .vue文件中
<scroll-view id="scroll-view">
<scroll-view-content>
<div id="article-header"></div>
<div id="article-body"></div>
<div id="article-footer"></div>
</scroll-view-content>
</scroll-view>
// js文件中
uni.pageScrollTo({
selector:"#article-body",
duration:300
})
上面的示例演示了如何跳转到id为article-body的位置，并设置滚动时长为300ms。
2. 使用uni.createSelectorQuery实现
除了使用scroll-view组件以外，还可以使用uni.createSelectorQuery方法实现跳转到页面指定位置。uni.createSelectorQuery方法能够返回一个SelectorQuery对象，用于查询节点信息。
要实现跳转到页面指定位置，可以先通过uni.createSelectorQuery方法查询出节点信息，然后通过节点信息计算出滚动位置，最后调用uni.pageScrollTo方法实现滚动跳转。
// .vue文件中
<div id="article">
<div id="article-header"></div>
<div id="article-body"></div>
<div id="article-footer"></div>
</div>
// js文件中
uni.createSelectorQuery().select('#article').boundingClientRect(data => {
uni.pageScrollTo({
scrollTop: data.top + 100,
duration: 300
})
}).exec()
上面的示例演示了如何通过节点信息计算出滚动位置，并设置滚动时长为300ms。
总结
本文介绍了如何在uniapp中实现跳转到页面指定位置。可以使用scroll-view组件实现滚动跳转，也可以使用uni.createSelectorQuery方法计算出滚动位置。两种方法都可以实现页面内跳转，开发者可以根据实际需求来选择合适的方法。