uniapp锚点点击-页面跳转

javascript 复制代码
// 如下:
<template>
	<div id="home">
		<div v-for="(item, index) in list" :key="index" @click="onClick(item, index)">
			<div :id="'node' + index"></div>
		</div>
	</div>
</template>	

点击元素后

javascript 复制代码
const id = `#node${index}`

uni.createSelectorQuery().in(this).select(id).boundingClientRect((data) => {
   uni.createSelectorQuery().select('#home').boundingClientRect((res) => {
    // console.log('node', data.top)
    // console.log('home', res.top)
    uni.pageScrollTo({
      scrollTop: data.top - res.top - 200,
      duration: 300,
    })
  }).exec()
}).exec()
相关推荐
小朋友,你是否有很多问号?4 分钟前
Spark10- RDD转DataFrame的三种方式
大数据·javascript·spark
Wiktok19 分钟前
pureadmin的动态路由和静态路由
前端·vue3·pureadmin
devii6619 分钟前
html.
前端
掘金安东尼23 分钟前
为什么浏览器要限制 JavaScript 定时器?
前端·javascript·github
学前端搞口饭吃27 分钟前
react context如何使用
前端·javascript·react.js
GDAL32 分钟前
为什么Cesium不使用vue或者react,而是 保留 Knockout
前端·vue.js·react.js
IT_陈寒33 分钟前
《Java 21新特性实战:5个必学的性能优化技巧让你的应用快30%》
前端·人工智能·后端
海绵宝宝不喜欢侬38 分钟前
【uniapp微信小程序】扫普通链接二维码打开小程序
微信小程序·小程序·uni-app
小蒜学长42 分钟前
基于uni-app的蛋糕订购小程序的设计与实现(代码+数据库+LW)
java·数据库·spring boot·后端·小程序·uni-app
小谭鸡米花44 分钟前
uni小程序中使用Echarts图表
前端·小程序·echarts