Сапер загружает страницы друг под другом

У меня есть приложение sapper / svelte, которое, когда я перехожу со страницы своего профиля на другую страницу (скажем, домой), домашняя страница загружается под страницей профиля на долю секунды. Потом загружается нормально.

Прежде чем нажать, чтобы вернуться домой:

введите описание изображения здесь

После нажатия ссылки на главную страницу:  введите описание изображения здесь

Для меня это безумие, и я понятия не имею, что происходит ??

Через долю секунды страница профиля исчезает, а домашняя страница отображается правильно.


person GrepThis    schedule 25.05.2020    source источник
comment
Как кто-нибудь может вам помочь, если вы не предоставите код, контекст и т. Д.?   -  person Thomas Hennes    schedule 26.05.2020
comment
@ThomasHennes Ничего особенного не происходит. Не так много кода, чтобы показать, что это просто навигация по саперному приложению   -  person GrepThis    schedule 26.05.2020
comment
Я не уверен, почему людям не понравился этот вопрос ... это хороший вопрос, и я тоже сталкиваюсь с этой проблемой.   -  person Acidic9    schedule 24.11.2020


Ответы (1)


Одно из объяснений может заключаться в том, что вы используете transitions во внешних элементах страниц.

При использовании, например, перехода fade, предоставляемого Svelte, элементы, которые появляются и исчезают одновременно (например, чтобы заменять друг друга), оба будут видны на протяжении перехода.

Чтобы избежать такого поведения, вам нужно добавить delay к плавно проявляющемуся элементу, что соответствует продолжительности плавного перехода. Это приведет к тому, что новый элемент будет видимым только тогда, когда старый элемент уже удален из DOM.

В качестве примера:

<main in:fade={{ delay: 100, duration: 100 }} out:fade={{ duration: 100}}>

Дополнительную информацию о параметрах перехода см. В документации Svelte.

person silllli    schedule 26.05.2020
comment
Да, очевидно, любой переход «out», независимо от того, насколько глубоко в дереве находится узел, повлияет на отключение родительских элементов DOM. Это должно быть ошибка в svelte. Но это могло быть решением. Спасибо - person GrepThis; 26.05.2020
comment
Я думаю, вы можете использовать модификатор local, чтобы предотвратить это: «Локальные переходы воспроизводятся только тогда, когда блок, которому они принадлежат, создается или уничтожается, а не когда родительские блоки создаются или уничтожаются». Svelte docs - person silllli; 26.05.2020