如何获取节点的方法,动态计算节点高度
监听节点偏移量
onScroll(e) { const { scrollTop } = e.detail; // 根据组件的高度,计算当前的区间在哪个位置 this.data.scrollIntoview = ""; this.data.activeKey = this.getActiveKey(scrollTop); this.setData(this.data); },`` ```javascript
动态获取节点,进行计算
用 createSelectorQuery 方法 查询请求 : boundingClientRect
onReady: function () { // 拿到查询器 const query = this.createSelectorQuery(); //通过class 查询组件 ,给一个查询的请求,boundingClientRect 把回调函数交给他,最后执行 query.selectAll(".comm-card").boundingClientRect(rect => { //console.log(rect); // 封装方法 (判断逻辑) this.getActiveKey = top => { //初始值为0 let start = 0, end = 0, activeKey = 0; // 迭代,用some 方法,some 可以中断迭代, 其他方法会继续执行 rect.some((item, index) => { // 比对节点信息 start = end; end = end + item.height; //加第一个区间 const isStop = top >= start && top < end; activeKey = index + 1; return isStop }); return activeKey; } }).exec() // 执行 exec() },
上一篇:
uniapp开发微信小程序-2.页面制作