Composable useRewriteURL

useRewriteURL composable для Vue 3 призначений для обробки локалізованих перезаписів URL на клієнті. Він автоматично виправляє URL у браузері до його «красивої» локалізованої версії на основі поточної локалі користувача та конфігурації у intlayer.config.ts.

Це реалізовано за допомогою window.history.replaceState, що дозволяє уникнути небажаних навігацій через Vue Router.

Використання

Викликайте composable всередині вашої функції setup() або у <script setup>.

<script setup>import { useRewriteURL } from "vue-intlayer";// Автоматично виправляє /fr/tests на /fr/essais у адресному рядку, якщо існує правило переписуuseRewriteURL();</script><template>  <router-view /></template>

Як це працює

1. Реактивний моніторинг: composable встановлює watch на locale користувача.
2. Пошук відповідності перепису: Коли змінюється локаль (або при монтуванні), він перевіряє, чи збігається поточний window.location.pathname з канонічним маршрутом, для якого існує більш читабельний локалізований alias.
3. Виправлення URL: Якщо знайдено більш читабельний alias, composable викликає window.history.replaceState, щоб оновити адресний рядок без перезавантаження сторінки або втрати стану роутера.

Чому варто використовувати?

• Оптимізація SEO: Гарантує, що пошукові системи індексують авторитетну локалізовану версію ваших URL. /// Покращений UX: Виправляє вручну введені URL, щоб відображати ваші бажані найменування (наприклад, /fr/a-propos замість /fr/about). /// Низьке навантаження: Тихо оновлює URL без повторного виклику життєвих циклів компонентів або navigation guards. /// ///