Creation:2025-08-23Last update:2025-08-23
Tham chiếu tài liệu này tới trợ lý AI yêu thích của bạnChatGPTClaudeDeepSeekGoogle AI modeGeminiPerplexityMistralGrok
Đặt câu hỏi và nhận tóm tắt tài liệu bằng cách tham chiếu trang này và nhà cung cấp AI bạn chọn
Nội dung của trang này đã được dịch bằng AI.
Xem phiên bản mới nhất của nội dung gốc bằng tiếng AnhEdit this doc
If you have an idea for improving this documentation, please feel free to contribute by submitting a pull request on GitHub.
GitHub link to the documentationCopy
Copy doc Markdown to clipboard
Hook useRewriteURL
Hook useRewriteURL cho Svelte được thiết kế để quản lý việc viết lại URL theo ngôn ngữ ở phía client. Nó tự động sửa URL trên trình duyệt thành phiên bản "đẹp" đã được địa phương hóa dựa trên locale hiện tại và cấu hình trong intlayer.config.ts.
Nó cập nhật URL một cách im lặng sử dụng window.history.replaceState, tránh việc điều hướng toàn bộ của SvelteKit.
Sử dụng
Gọi hook bên trong một component Svelte.
svelte
Sao chép mã
Sao chép mã vào clipboard
<script> import { useRewriteURL } from "svelte-intlayer"; // Tự động sửa /fr/tests thành /fr/essais trên thanh địa chỉ nếu tồn tại quy tắc rewrite useRewriteURL();</script><slot />Cách hoạt động
- Cập nhật phản ứng: Hook đăng ký vào store
localecủa Intlayer. - Phát hiện: Mỗi khi locale thay đổi (hoặc khi mount), hook sẽ tính toán xem
window.location.pathnamehiện tại có một alias địa phương hóa "đẹp hơn" được định nghĩa trong các quy tắc rewrite của bạn hay không. - Sửa URL: Nếu tìm thấy đường dẫn "đẹp hơn", hook gọi
window.history.replaceStateđể cập nhật thanh địa chỉ mà không reload toàn bộ trang hoặc kích hoạt logic điều hướng của SvelteKit.
Tại sao dùng nó?
- Thực hành tốt cho SEO: Đảm bảo các công cụ tìm kiếm chỉ lập chỉ mục phiên bản địa phương hóa "đẹp" của URL của bạn.
- Cải thiện UX: Sửa các URL nhập thủ công để phản ánh cấu trúc đặt tên ưu tiên của bạn.
- Cập nhật âm thầm: Thay đổi thanh địa chỉ mà không ảnh hưởng đến component tree hoặc navigation history.