uni-app获取dom元素到顶部的距离以及操作dom元素的一些样式
一、
1、首先有一个元素
<view class="activity" ref="btn"></view>
2、确认指针指向
this.$refs.btn.$el.getBoundingClientRect()
https://developer.mozilla.org/zh-CN/docs/Web/API/Element/getBoundingClientRect
例:
打印出:
可获得 用于描述边框的只读属性——left、top、right、bottom等,单位为像素。除了 width 和 height 外的属性都是相对于视口的左上角位置而言的。
操作样式:
this.$refs.btn.$el.style.position = 'fixed' this.$refs.btn.$el.style.top = 0;
二、
如果想要滚动到指定位置
1、首先有一个元素
<view class="sticke"></view>
uni.createSelectorQuery().select(".sticke").boundingClientRect((res)=>{ uni.pageScrollTo({ duration:0, scrollTop:800 }) }).exec()
使用 uni.createSelectorQuery 方法查找元素,使用 uni.pageScrollTo 方法使其滚动到相应位置(scrollTop),
duration 在我使用过程中,设置除0以外其他数字均在第一次滚动后报错,所以最好还是设置为0。