fix(gxnlpt): 收录/收藏切换时侧边栏sticky元素错位
- initSidebarSticky 移除 contentView !== 'list' 早退条件 sticky 内容(分类+收录/收藏按钮)在 list/submit/favorites 三个视图下完全一致, 移除 portal 与 inline 定位的视图限制,避免切换后 CSS 默认 top:0/left:0 飘到视口左上角 - openSubmitView/openFavoritesView 不再 destroySidebarSticky 改为 $nextTick 调 refreshSidebarStickyGeometry 重新测量并刷新 left/width/top - 新增 refreshSidebarStickyGeometry 清掉 _lastSticky* 死区缓存,强制 _applySidebarSticky 把新值写到 element.style Co-authored-by: Cursor <cursoragent@cursor.com>
This commit is contained in:
parent
1beb24053f
commit
6b8e38e3d7
@ -1085,18 +1085,37 @@ export default {
|
|||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
this.destroyScrollSpy();
|
this.destroyScrollSpy();
|
||||||
this.destroySidebarSticky();
|
|
||||||
this.contentView = 'submit';
|
this.contentView = 'submit';
|
||||||
this.resetSubmitForm();
|
this.resetSubmitForm();
|
||||||
|
// 视图切换后 sidebar 容器高度可能变化,sticky 需要重新测量几何并刷新 left/width/top,
|
||||||
|
// 否则 element.style 上残留旧值会让侧边栏在视口里"错位"。
|
||||||
|
this.$nextTick(() => this.refreshSidebarStickyGeometry());
|
||||||
},
|
},
|
||||||
openFavoritesView() {
|
openFavoritesView() {
|
||||||
if (!this.ensureLogin('查看我的收藏')) {
|
if (!this.ensureLogin('查看我的收藏')) {
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
this.destroyScrollSpy();
|
this.destroyScrollSpy();
|
||||||
this.destroySidebarSticky();
|
|
||||||
this.contentView = 'favorites';
|
this.contentView = 'favorites';
|
||||||
this.loadFavorites();
|
this.loadFavorites();
|
||||||
|
// 视图切换后 sidebar 容器高度可能变化,sticky 需要重新测量几何并刷新 left/width/top,
|
||||||
|
// 否则 element.style 上残留旧值会让侧边栏在视口里"错位"。
|
||||||
|
this.$nextTick(() => this.refreshSidebarStickyGeometry());
|
||||||
|
},
|
||||||
|
/**
|
||||||
|
* 视图切换后重新测量 sidebar / sticky 几何常量,并立即应用最新的 left/width/top。
|
||||||
|
* 不重新走 initSidebarSticky/destroySidebarSticky(避免把 sticky 元素搬回容器再搬出,
|
||||||
|
* 减少不必要的 DOM 抖动)。
|
||||||
|
*/
|
||||||
|
refreshSidebarStickyGeometry() {
|
||||||
|
if (this.isStackedNavMode) return;
|
||||||
|
this._recomputeStickyGeometry();
|
||||||
|
// 清掉上次缓存的死区值,确保 _applySidebarSticky 一定会把新值写到 element.style
|
||||||
|
this._lastStickyTop = undefined;
|
||||||
|
this._lastStickyLeft = undefined;
|
||||||
|
this._lastStickyWidth = undefined;
|
||||||
|
this._lastStickyVisible = undefined;
|
||||||
|
this._applySidebarSticky();
|
||||||
},
|
},
|
||||||
async loadFavorites() {
|
async loadFavorites() {
|
||||||
this.favoritesLoading = true;
|
this.favoritesLoading = true;
|
||||||
@ -1399,7 +1418,11 @@ export default {
|
|||||||
},
|
},
|
||||||
initSidebarSticky() {
|
initSidebarSticky() {
|
||||||
this.destroySidebarSticky();
|
this.destroySidebarSticky();
|
||||||
if (this.isStackedNavMode || this.contentView !== 'list') return;
|
// 注意:不再因 contentView !== 'list' 提前 return。
|
||||||
|
// 侧边栏 sticky 内容(分类 + 收录/收藏 按钮)在 list/submit/favorites 三个视图下都
|
||||||
|
// 完全一致,sticky 元素需要持续保持 fixed 定位,否则切换 view 后元素会被 CSS 默认
|
||||||
|
// 的 top:0/left:0 钉到视口左上角,导致侧边栏"错位"。
|
||||||
|
if (this.isStackedNavMode) return;
|
||||||
|
|
||||||
const scrollRoot = this.getScrollRoot();
|
const scrollRoot = this.getScrollRoot();
|
||||||
if (!scrollRoot) return;
|
if (!scrollRoot) return;
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user