fix(notes): wait for stacked note element before scrolling on mobile
A single nextTick is not enough for a freshly added stacked note to be in the DOM, so the mobile scroll target was computed against a null element. Poll with requestAnimationFrame (mirroring scrollToHashInNote) and use offsetTop, with an (index + 1) * height fallback.
This commit is contained in:
@@ -47,6 +47,30 @@ export const useRouteQueryStackedNotes = () => {
|
|||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
|
||||||
|
const scrollToNoteElement = (
|
||||||
|
cleanNoteId: string,
|
||||||
|
index: number,
|
||||||
|
attempts = 30
|
||||||
|
) => {
|
||||||
|
if (attempts <= 0) {
|
||||||
|
scrollToNote((index + 1) * height.value)
|
||||||
|
return
|
||||||
|
}
|
||||||
|
|
||||||
|
const element = document.querySelector(
|
||||||
|
`.note-${cleanNoteId}`
|
||||||
|
) as HTMLElement | null
|
||||||
|
|
||||||
|
if (element) {
|
||||||
|
scrollToNote(element.offsetTop)
|
||||||
|
return
|
||||||
|
}
|
||||||
|
|
||||||
|
requestAnimationFrame(() => {
|
||||||
|
scrollToNoteElement(cleanNoteId, index, attempts - 1)
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
type ScrollToFocusedNoteOptions = {
|
type ScrollToFocusedNoteOptions = {
|
||||||
noteId?: string | null
|
noteId?: string | null
|
||||||
notes?: string[]
|
notes?: string[]
|
||||||
@@ -65,13 +89,7 @@ export const useRouteQueryStackedNotes = () => {
|
|||||||
|
|
||||||
if (isMobile.value) {
|
if (isMobile.value) {
|
||||||
if (noteId) {
|
if (noteId) {
|
||||||
const cleanNoteId = noteId.replaceAll(":", "-")
|
scrollToNoteElement(noteId.replaceAll(":", "-"), index)
|
||||||
const element = document.querySelector(
|
|
||||||
`.note-${cleanNoteId}`
|
|
||||||
) as HTMLElement
|
|
||||||
|
|
||||||
const top = (index + 1) * (element?.clientHeight ?? height.value)
|
|
||||||
scrollToNote(top)
|
|
||||||
} else {
|
} else {
|
||||||
scrollToNote(0)
|
scrollToNote(0)
|
||||||
}
|
}
|
||||||
|
|||||||
Reference in New Issue
Block a user