Skip to content

Using .addRoutes when you've got a wildcard route for 404s does not work #1176

@Dadibom

Description

@Dadibom

Vue.js / vue-router versions

2.1.10 / 2.2.1

Reproduction Link

https://jsfiddle.net/ytezcvzq/4/

Steps to reproduce

Add a new route when you've already got a wildcard route to display page not found messages

What is Expected?

The new route should be matched before the wildcard route

What is actually happening?

the wildcard route is matched first, meaning addRoutes does not work

Activity

Dadibom

Dadibom commented on Feb 17, 2017

@Dadibom
Author

This happens even when the wildcard route is a child route of '/', which is kinda strange. I do think that "root" routes should have higher priority than child routes.

posva

posva commented on Feb 18, 2017

@posva
Member

Hey, thanks for opening the issue.
This is indeed a caveat of dynamically added routes. FTM you'll have to add the wild card route after any other route.

ping @fnlctrl @yyx990803

Dadibom

Dadibom commented on Feb 18, 2017

@Dadibom
Author

Maybe there could be an option to prepend the new routes instead of appending them?

fnlctrl

fnlctrl commented on Feb 18, 2017

@fnlctrl
Member

Hmm maybe dynamically added routes should have higher priority than the statically defined ones?

@Dadibom Yeah an option seems nice

LinusBorg

LinusBorg commented on Feb 22, 2017

@LinusBorg
Member

Another option would be to optionally make addRoutes override old routes (.addRoutes(newRoutes,{ override: true })), so you can construct a new routes array externally the way you need it?

posva

posva commented on Feb 22, 2017

@posva
Member

We can also keep track of any asterisk route (path: '*') so dynamically added routes are always added before that one.
People will still have issues if there's some route with foo-* and they dynamically add routes like foo-lol and foo-bar but I don't see a real world example about a partial asterisk while having an asterisk route is very common

Dadibom

Dadibom commented on Feb 23, 2017

@Dadibom
Author

I'd be fine with any of the solutions mentioned, but I think the most transparent one would be appendRoutes / prependRoutes / replaceRoutes

DanielPe05

DanielPe05 commented on Apr 3, 2017

@DanielPe05

Is there an update for this? I just ran into it. I think that keeping track of path: '*' and adding dynamic routes before it as suggested by @posva is the simplest, quickest solution. However as a more complete fix that would give more flexibilities, I think being able to appendRoute/prependRoute makes more sense.

5 remaining items

Loading
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Assignees

No one assigned

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

      Development

      No branches or pull requests

        Participants

        @yyx990803@posva@LinusBorg@DanielPe05@fnlctrl

        Issue actions

          Using .addRoutes when you've got a wildcard route for 404s does not work · Issue #1176 · vuejs/vue-router