Pouya M
Pouya M

Reputation: 385

How to handle non english character in vue-router as a path

How to have non-English characters in path as a Url?(If not wanting to do anything with server configs!) like the example below:

https://example.com/صفحه_مورد_نظر

Vue-router does not understand non-English characters!


const router = createRouter({
  history: createWebHistory(import.meta.env.BASE_URL),
  routes: [
    {
      path: '/صفحه_مورد_نظر',
      name: "home",
      component: Home,
    },  
  ],
});

Upvotes: 2

Views: 462

Answers (1)

Pouya M
Pouya M

Reputation: 385

The solution is to use a built-in js function called encodeURI(). It is also helpful when dealing with non-English characters in other places like tooltips or when you hover over a link!


const router = createRouter({
  history: createWebHistory(import.meta.env.BASE_URL),
  routes: [
    {
      path: '/'+ encodeURI('صفحه_مورد_نظر'),
      name: "home",
      component: Home,
    },  
  ],
});

Upvotes: 3

Related Questions