权限页面优化左右联动问题
This commit is contained in:
@@ -53,7 +53,7 @@
|
|||||||
arr: [],
|
arr: [],
|
||||||
scrollRightTop: 0, // 右边栏目scroll-view的滚动条高度
|
scrollRightTop: 0, // 右边栏目scroll-view的滚动条高度
|
||||||
timer: null, // 定时器
|
timer: null, // 定时器
|
||||||
|
isTabClickOver:true
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
onLoad() {
|
onLoad() {
|
||||||
@@ -92,6 +92,7 @@
|
|||||||
await this.getMenuItemTop();
|
await this.getMenuItemTop();
|
||||||
}
|
}
|
||||||
if (index == this.current) return;
|
if (index == this.current) return;
|
||||||
|
this.isTabClickOver = false;
|
||||||
this.scrollRightTop = this.oldScrollTop;
|
this.scrollRightTop = this.oldScrollTop;
|
||||||
this.$nextTick(function() {
|
this.$nextTick(function() {
|
||||||
this.scrollRightTop = this.arr[index];
|
this.scrollRightTop = this.arr[index];
|
||||||
@@ -136,6 +137,9 @@
|
|||||||
},
|
},
|
||||||
// 设置左边菜单的滚动状态
|
// 设置左边菜单的滚动状态
|
||||||
async leftMenuStatus(index) {
|
async leftMenuStatus(index) {
|
||||||
|
if (!this.isTabClickOver) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
this.current = index;
|
this.current = index;
|
||||||
// 如果为0,意味着尚未初始化
|
// 如果为0,意味着尚未初始化
|
||||||
if (this.menuHeight == 0 || this.menuItemHeight == 0) {
|
if (this.menuHeight == 0 || this.menuItemHeight == 0) {
|
||||||
@@ -175,6 +179,10 @@
|
|||||||
if (!this.menuHeight) {
|
if (!this.menuHeight) {
|
||||||
await this.getElRect('menu-scroll-view', 'menuHeight');
|
await this.getElRect('menu-scroll-view', 'menuHeight');
|
||||||
}
|
}
|
||||||
|
if (e.detail.scrollTop == 0) {
|
||||||
|
this.isTabClickOver = true;
|
||||||
|
// return swichMenu(0)
|
||||||
|
}
|
||||||
setTimeout(() => { // 节流
|
setTimeout(() => { // 节流
|
||||||
this.timer = null;
|
this.timer = null;
|
||||||
// scrollHeight为右边菜单垂直中点位置
|
// scrollHeight为右边菜单垂直中点位置
|
||||||
@@ -184,7 +192,11 @@
|
|||||||
let height2 = this.arr[i + 1];
|
let height2 = this.arr[i + 1];
|
||||||
// 如果不存在height2,意味着数据循环已经到了最后一个,设置左边菜单为最后一项即可
|
// 如果不存在height2,意味着数据循环已经到了最后一个,设置左边菜单为最后一项即可
|
||||||
if (!height2 || scrollHeight >= height1 && scrollHeight < height2) {
|
if (!height2 || scrollHeight >= height1 && scrollHeight < height2) {
|
||||||
this.leftMenuStatus(i);
|
if(this.isTabClickOver){
|
||||||
|
this.leftMenuStatus(i);
|
||||||
|
}else{
|
||||||
|
this.isTabClickOver = true;
|
||||||
|
}
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@@ -265,6 +277,7 @@
|
|||||||
|
|
||||||
.u-tab-view {
|
.u-tab-view {
|
||||||
height: 100%;
|
height: 100%;
|
||||||
|
background-color: #f6f6f6;
|
||||||
}
|
}
|
||||||
|
|
||||||
.right-box {
|
.right-box {
|
||||||
|
|||||||
Reference in New Issue
Block a user