if (this.fullpage.current + 1 <= len) { // 如果当前页面编号+1 小于总个数,则可以执行向下滑动
this.fullpage.current += 1; // 页面+1
this.move(this.fullpage.current); // 执行切换
}
},
pre() {// 往上切换
if (this.fullpage.current - 1 > 0) { // 如果当前页面编号-1 大于0,则可以执行向下滑动
this.fullpage.current -= 1;// 页面+1
this.move(this.fullpage.current);// 执行切换
}
},
move(index) {
this.fullpage.isScrolling = true; // 为了防止滚动多页,需要通过一个变量来控制是否滚动
this.directToMove(index); //执行滚动
setTimeout(() => { //这里的动画是1s执行完,使用setTimeout延迟1s后解锁
this.fullpage.isScrolling = false;
}, 1010);
},
directToMove(index) {
let height = this.$refs[“fullPage”].clientHeight; //获取屏幕的宽度
let scrollPage = this.$refs[“fullPageContainer”]; // 获取执行tarnsform的元素
let scrollHeight; // 计算滚动的告诉,是往上滚还往下滚
scrollHeight= -(index - 1) * height + “px”;
scrollPage.style.transform = translateY(${scrollHeight})
;
this.fullpage.current = index;
},
mouseWheelHandle(event) { // 监听鼠标监听
// 添加冒泡阻止
let evt = event || window.event;
if (evt.stopPropagation) {
evt.stopPropagation();
} else {
evt.returnValue = false;
}
if (this.fullpage.isScrolling) { // 判断是否可以滚动
return false;
}
let e = event.originalEvent || event;
this.fullpage.deltaY = e.deltaY || e.detail; // Firefox使用detail
if (this.fullpage.deltaY > 0) {
this.next();
} else if (this.fullpage.deltaY < 0) {
this.pre();
}
}
}
};