I have problem with vuetify tabs. Everything works fine, but when I add exact parameter to v-tab the bottom bar animation stops working. Tabs display correctly but v-tabs-slider-wrapper position isn't updated.
Without exact parameter is ok.
How do I fix this animation?
routes.js
{
path: "/course",
component: Course,
children: [
{
path: "",
component: CourseDetails,
name: "courseDetails"
},
{
path: "lessons",
component: CourseLessons,
name: "courseLessons"
},
{
path: "reviews",
component: CourseReviews,
name: "courseReviews"
},
]
},
Course.vue
<template>
<v-container fluid>
<v-row>
<v-col>
<v-tabs v-model="activeTab" grow>
<v-tab to="/course" exact>Details</v-tab>
<v-tab to="/course/lessons" exact>Lessons</v-tab>
<v-tab to="/course/reviews" exact>Reviews</v-tab>
</v-tabs>
</v-col>
</v-row>
<v-row>
<v-col cols="12">
<router-view></router-view>
</v-col>
</v-row>
</v-container>
</template>
<script>
export default {
name: "Course",
data: () => ({
activeTab: null
})
};
</script>