Inject route name without localization

Is your feature request related to a problem? Please describe.

When you work with localized route path, the only way to get the original route name is to remove the "___xx" extra string from it. For exemple, I use vuex-router-sync to build my multi steps form. This way I can rely on the url to ensure the user didn’t cheat any step. Middleware + store help me to achieve that. It’s very annoying to split the localized route.name property each time. Plus I feel not confortable with this hacky method.

Describe the solution you’d like

If I could have a unique id injected in the route object it would solve this. For exemple, the raw name would do the trick. This way I can :

• use it as a unique and useful id no matter the locale
• use localPath({ name }) method to navigate to it

Describe alternatives you’ve considered

A working alternative is to retrieve this raw name by splitting the route name by "___"

[existe-deja]

I blame the vuex-router-sync package to soon. I experienced problems with nested routes. The final fix to this is:

extendRoutes(routes) {
      for (const route of routes) {
        route.meta = {
          ...route.meta,
          immutableName: route.name
        };
        if (route.children) {
          for (const child of route.children) {
            child.meta = {
              ...child.meta,
              immutableName: child.name
            };
          }
        }
      }
    }

[rchl]

You have to return the routes. Or alternatively, modify the original route instead of creating a new list.

Also, I don’t think you can just add any property on the route object directly. Look at available properties at https://router.vuejs.org/api/#route-object-properties.

The meta object is likely a good choice in this case. Maybe try:

    extendRoutes(routes) {
        for (const route of routes) {
            route.meta = {
                immutableName: route.name,
            };
        }
    }