[Feature Request] How to use Tabs with Vue-Router?

[5T0NkZ5V2j0H76y0]

Existing Component

Yes

Component Name

Tabs

Description

I would like to use Tabs in parallel with the routes in vue-router. What is the best pattern?
There should also be a possibility to have several parameters in the route. e.g. dashboard/users/01594/posts/89413.

Thanks in advance.

[Leopoldthecoder]

https://jsfiddle.net/leopoldthecuber/7wc5syyo/7/

[MaciejJanyska]

This issue should't be closed I guess because if you click on Tab but not text within it, routes doesn't work properly in above example.

[wdonnell]

Here's an alternate implementation of @Leopoldthecoder's example that uses the before-leave hook on el-tabs to capture the tab change and update the route. You can click anywhere within the tab area:

https://jsfiddle.net/jhsx5up9/

Note that the parameters on the before-leave callback were only recently added so you'll want to update Element to at least 2.4.3

You can have several parameters in the route by using named routes and passing them as part of the $router.push:

        this.$router.push({
          name: 'yourNamedRoute', 
          params: {
            userId: valueA,
            postId: valueB
          }
        });