Vue Route 4 can’t read the Arabic link when refresh browser

[ockba-a]

What problem does this feature solve?

Vue Route can’t read the link when Refresh Browser in hexadecimal

The route is Arabic language in alias and route

Ex:
jmbz0.csb.app/تواصل

Dependecy
Vue 3
Vue Route 4.0.3

You can visit sandbox
Vue Route

I Open The Issue In:

StackOverFlow

And

Vuejs Forum

regard

[posva]

You need to provide valid URLs in their encoded form, for example:

{ path: "/about", alias: encodeURI("/عنا"), component: About },
  { path: encodeURI("/تواصل"), component: Contact },

Also, make sure to provide the correct values when using string locations (<router-link to="/español"> should be encoded properly): https://next.router.vuejs.org/guide/migration/index.html#named-children-routes-with-an-empty-path-no-longer-appends-a-slash

In your code:

<router-link :to="encodeURI('/عنا')">About</router-link> |
  <router-link :to="encodeURI('/تواصل')">Contact</router-link>

To make things easier, use named routes

I thought I documented this but I couldn't find it so I will open a new issue to track it

[posva]

BTW the repository for vue router 4 is https://github.com/vuejs/vue-router-next