一个小笔记
盒子设置横向滚动。
列表宽度-屏幕宽度 = 卷曲宽度
<div id="tablist" @scroll="tabScroll">
列表/内容
</div>
methods: {
tabScroll() {
const scrollLeft = document.getElementById("tablist").scrollLeft;
// console.log("滚动的宽度", scrollLeft);
const clientWidth = document.getElementById("tablist").offsetWidth;
// console.log("盒子的宽度", clientWidth);
const tablist = document.getElementById("tablist").scrollWidth;
// console.log("列表宽度", tablist);
if (tablist - clientWidth === scrollLeft) {
// 列表宽度-盒子宽度 = 卷曲宽度
this.$message({
message: "没有更多了",
type: "warning",
});
}
},
}
给盒子设置固定宽度,通过id、class操作。