我希望能够在用户单击v-tab中定义的选项卡时更新URL。这样,url就可以共享了。当另一个用户使用该共享url时,他们应该能够从URL中定义的相同选项卡开始。这个是可能的吗?
发布于 2020-06-10 23:32:35
您可以将一个方法附加到选项卡元素的@click
事件,这将在单击时更改路由。
如果您想要在页面加载时自动更改所选标签,您可以获取当前路由,并只需在mounted()
钩子中设置标签:
<v-tabs
v-model="selectedTab"
>
<v-tab
v-for="tab in tabs"
@click="updateRoute(tab.route)
>
...
data () {
return {
selectedTab: 0,
tabs: [
{
name: 'tab1',
route: 'route1'
},
{
name: 'tab1',
route: 'route1'
}
]
}
},
mounted() {
// Get current route name
// Find the tab with the same route (property value)
// Set that tab as 'selectedTab'
const tabIndex = this.tabs.findIndex(tab => tab.route === this.$route.name)
this.selectedTab = tabIndex
},
methods: {
updateRoute (route) {
this.$router.push({ path: route })
}
}
https://stackoverflow.com/questions/62314452
复制