diff --git a/ecosystem/plugin-theme-data/src/client/config.ts b/ecosystem/plugin-theme-data/src/client/config.ts
index be1ee5fb6a..96d993000f 100644
--- a/ecosystem/plugin-theme-data/src/client/config.ts
+++ b/ecosystem/plugin-theme-data/src/client/config.ts
@@ -1,6 +1,6 @@
 import { setupDevtoolsPlugin } from '@vue/devtools-api'
 import { defineClientConfig, routeLocaleSymbol } from '@vuepress/client'
-import { computed } from 'vue'
+import { ref, watch } from 'vue'
 import {
   resolveThemeLocaleData,
   themeLocaleDataSymbol,
@@ -12,10 +12,30 @@ export default defineClientConfig({
     // provide theme data & theme locale data
     const themeData = useThemeData()
     const routeLocale =
-      app._context.provides[routeLocaleSymbol as unknown as string]
-    const themeLocaleData = computed(() =>
+      app._context.provides[routeLocaleSymbol as unknown as symbol]
+
+    const themeLocaleData = ref(
       resolveThemeLocaleData(themeData.value, routeLocale.value)
     )
+    watch(
+      () => routeLocale.value,
+      (newRouteLocale, oldRouteLocale) => {
+        if (newRouteLocale !== oldRouteLocale)
+          themeLocaleData.value = resolveThemeLocaleData(
+            themeData.value,
+            routeLocale.value
+          )
+      }
+    )
+    watch(
+      () => themeData.value,
+      () => {
+        themeLocaleData.value = resolveThemeLocaleData(
+          themeData.value,
+          routeLocale.value
+        )
+      }
+    )
     app.provide(themeLocaleDataSymbol, themeLocaleData)
 
     Object.defineProperties(app.config.globalProperties, {