Прокрутка без сдвига в Livewire

Давайте разберём такой случай. Слева длинное меню постов, человек докрутил его вниз и выбрал пункт ближе к концу списка. После перехода на другую страницу меню снова оказывается сверху, и приходится искать то же место заново.

Блок оборачивают в @persist с именем, а на контейнер меню вешают wire:navigate:scroll: Livewire запоминает прокрутку этого элемента между навигационными переходами. Ссылки внутри по-прежнему ведут себя как навигационные.

Страницы откроются по адресам /posts и /posts/create. Давайте на списке выведем меню в сохраняемом блоке:

<x-layout>
	@persist('menu')
		<div wire:navigate:scroll>
			<a href="/posts" wire:navigate>All</a>
			<a href="/posts/create" wire:navigate>Create</a>
			<a href="/posts" wire:navigate>Item 1</a>
			<a href="/posts" wire:navigate>Item 2</a>
			<a href="/posts" wire:navigate>Item 3</a>
			<a href="/posts" wire:navigate>Item 4</a>
			<a href="/posts" wire:navigate>Item 5</a>
			<a href="/posts" wire:navigate>Item 6</a>
			<a href="/posts" wire:navigate>Item 7</a>
			<a href="/posts" wire:navigate>Item 8</a>
		</div>
	@endpersist
	<h1>Posts</h1>
</x-layout>

Давайте на второй странице повторим то же меню:

<x-layout>
	@persist('menu')
		<div wire:navigate:scroll>
			<a href="/posts" wire:navigate>All</a>
			<a href="/posts/create" wire:navigate>Create</a>
			<a href="/posts" wire:navigate>Item 1</a>
			<a href="/posts" wire:navigate>Item 2</a>
			<a href="/posts" wire:navigate>Item 3</a>
			<a href="/posts" wire:navigate>Item 4</a>
			<a href="/posts" wire:navigate>Item 5</a>
			<a href="/posts" wire:navigate>Item 6</a>
			<a href="/posts" wire:navigate>Item 7</a>
			<a href="/posts" wire:navigate>Item 8</a>
		</div>
	@endpersist
	<h1>Create post</h1>
</x-layout>

Сделайте две страницы работников с общим длинным меню. При переходе между ними меню не прыгает наверх.