vue2滚动条加载更多数据实现代码
发布时间:2020-12-17 03:04:54 所属栏目:百科 来源:网络整理
导读:解析: 判断滚动条到底部,需要用到DOM的三个属性值,即scrollTop、clientHeight、scrollHeight。 scrollTop为滚动条在Y轴上的滚动距离。 clientHeight为内容可视区域的高度。 scrollHeight为内容可视区域的高度加上溢出(滚动)的距离。 从这个三个属性的介
解析: 判断滚动条到底部,需要用到DOM的三个属性值,即scrollTop、clientHeight、scrollHeight。 scrollTop为滚动条在Y轴上的滚动距离。 clientHeight为内容可视区域的高度。 scrollHeight为内容可视区域的高度加上溢出(滚动)的距离。 从这个三个属性的介绍就可以看出来,滚动条到底部的条件即为scrollTop + clientHeight == scrollHeight。(兼容不同的浏览器)。 代码: 1.vue的实现html: js: 因为vue2 实现了m-v双向绑定,所以这里直接改变for循环数据源即可实现列表的数据刷新; 2: 普通js的实现html: js: Page: ' + i + ',Data Index: ' + i + ' '
}
$('#content ul').append(html);
}
});
以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持编程之家。 (编辑:李大同) 【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容! |