uniapp怎么实现页面跳转,uniapp跳转方式

　　uniapp实现锚点跳转的方法：将uniapp的【uni.createSelectorQuery()】方法与【uni.pageScrollTo(OBJECT)】方法结合使用即可。

　　单一应用程序开发（仿饿了么)开发课程：进入学习

　　本教程操作环境：windows7系统、uni-app2.5.1版本，戴尔自交第三代电脑。

　　推荐（免费）：uni-app开发教程

　　uniapp实现锚点跳转的方法：

　　将uniapp的uni.createSelectorQuery()方法与uni.pageScrollTo(对象)方法结合使用

　　核心代码

　　//从当前位置到达目标位置

　　uni.createSelectorQuery().选择(。评论-内容)。boundingClientRect(data={//目标位置的节点：类或者编号

　　uni.createSelectorQuery().选择(。弧内容)。boundingClientRect(res={//最外层盒子的节点：类或者编号

　　uni.pageScrollTo({

　　时长：100,//过渡时间

　　scrollTop:data.top - res.top，//到达距离顶部的顶端值

　　})

　　}).执行()

　　}).exec()；代码示例

　　模板

　　视图 arc-content id= arc-content

　　视图 class=信息-内容文章区域1000 .00/查看

　　view class= comment-content id= comment-content 评论区域1000 .00/查看

　　/查看

　　/模板

　　togglePosition(){

　　if(this.positionSelect){

　　this.positionSelect=false

　　//从评论区域回到顶部

　　uni.createSelectorQuery().选择(。评论-内容)。boundingClientRect(data={//目标位置的节点：类或者编号

　　uni.createSelectorQuery().选择(。弧内容)。boundingClientRect(res={//最外层盒子的节点：类或者编号

　　uni.pageScrollTo({

　　时长：100,//过渡时间

　　scrollTop:res.top - data.top，//返回顶部的顶端值

　　})

　　}).执行()

　　}).exec()；

　　}否则{

　　this.positionSelect=true

　　//从当前位置到达评论区域

　　uni.createSelectorQuery().选择(。评论-内容)。boundingClientRect(data={//目标位置的节点：类或者编号

　　uni.createSelectorQuery().选择(。弧内容)。boundingClientRect(res={//最外层盒子的节点：类或者编号

　　uni.pageScrollTo({

　　时长：100,//过渡时间

　　scrollTop:data.top - res.top，//到达距离顶部的顶端值

　　})

　　}).执行()

　　}).exec()；

　　}

　　},相关免费学习推荐：编程视频

　　以上就是uniapp如何实现锚点跳转的详细内容，更多请关注我们其它相关文章！

郑重声明：本文由网友发布，不代表盛行IT的观点，版权归原作者所有，仅为传播更多信息之目的，如有侵权请联系，我们将第一时间修改或删除，多谢。