-
|
Hello, I'm new to Problem:If I dynamically swap languages I get "stale" content when switching routes -- as-in the pages don't re-render for the new language. I think this is because If I:
Background:I'm using vue-router with unplugin-vue-router to create simple routes. I have fairly simple pages:
<script setup lang="ts">
import { useFluent } from "fluent-vue";
import { swapLocale, useLocale } from "@/fluent";
const { $t } = useFluent();
const { currentLocale, nextLocale } = useLocale();
</script>
<template>
<h1>{{ $t("title") }} ({{ currentLocale }}</h1>
<p>
{{ $t("description") }}
</p>
<router-link to="/other">
<button>{{ $t("nav-other") }}</button>
</router-link>
<button @click="swapLocale">Set lang={{ nextLocale }}</button>
</template>
<script setup lang="ts">
import { useFluent } from "fluent-vue";
import { swapLocale, useLocale } from "@/fluent";
const { $t } = useFluent();
const { currentLocale, nextLocale } = useLocale();
</script>
<template>
<h1>{{ $t("title") }} ({{ currentLocale }}</h1>
<p>
{{ $t("description") }}
</p>
<router-link to="/">
<button>{{ $t("nav-root") }}</button>
</router-link>
<button @click="swapLocale">Set lang={{ nextLocale }}</button>
</template>The only difference is the What's telling for me is that Am I doing something really wrong here? |
Beta Was this translation helpful? Give feedback.
Replies: 1 comment 10 replies
-
|
Can you share contents of |
Beta Was this translation helpful? Give feedback.
-
|
This all looks more or less correct. This should be working. As |
Beta Was this translation helpful? Give feedback.
-
|
I think the issue here is that The code isn't publicly available -- it's just a sandbox I was building to test all this stuff out. I'll see if I can get it into a sandbox, and I'll post back here. |
Beta Was this translation helpful? Give feedback.
-
|
I was able to recreate this using your code samples. Going to debug it. |
Beta Was this translation helpful? Give feedback.
-
|
Found the solution, but not the cause. 🙂 |
Beta Was this translation helpful? Give feedback.
-
|
Thanks for your report. You found a bug in |
Beta Was this translation helpful? Give feedback.
-
|
Ah ok, interesting. I did end up creating a sandbox, if you need it: https://codesandbox.io/p/sandbox/zealous-burnell-pjfm65 |
Beta Was this translation helpful? Give feedback.
-
|
I've also confirmed that your solution to remove |
Beta Was this translation helpful? Give feedback.
-
|
Also, just wanted to say thanks for the quick feedback and response. Much appreciated! |
Beta Was this translation helpful? Give feedback.
Found the solution, but not the cause. 🙂
If you remove
const { $t } = useFluent();from components, it should start working.