Strange issue where language is changing on mouseover?

[alancwoo]

I'm trying to adapt the locale-router example and am having a bit of an odd issue where the language is changing on mouseover of a language switcher link:

<div>
	<a href="/{$locale}/about">{$t('menu.about')}</a>

	{#each $locales as lc}
		{#if lc !== $locale}
			<a href="/{lc}{route}">{$t(`lang.${lc}`)}</a>
		{/if}
	{/each}
</div>

localhost:5173/en
https://github.com/sveltekit-i18n/lib/assets/1481890/995ce932-64a9-434a-be99-ff3b42657f65

To be clear, no navigation occurs, the locale just switches on mouseover.

Am I doing something wrong or what exactly is happening here?

[alancwoo]

Ok, so for what it's worth, I thought maybe it was something to do with link preloading but data-sveltekit-preload-data="off" didn't help, so I've done the following instead which achieves what I want:

	{#each $locales as lc}
		{#if lc !== $locale}
			<button on:click={() => goto('/' + lc + route)}>{$t(`lang.${lc}`)}</button>
		{/if}
	{/each}

Of course, happy to learn if there is a better way to 'link' to the other language in a bilingual site.

[galaczi]

I faced the same issue and it was link preloading in my case. Make sure your links have the correct locale in them. If there is a different locale in the link that you hover, it will preload that locale.