我正在使用 Nuxt 动态路由来导航到页面,我想要的只是通过单击按钮来调度操作并一起导航。
<v-btn
rounded
depressed
dark
color="green"
@click="fetchSocietyData()"
:to="'societies/' + sname"
nuxt
>Show Details</v-btn
>
<v-btn
v-if="$auth.loggedIn"
rounded
depressed
dark
color="blue"
:to="'societies/_ed/' + sname"
nuxt
>Edit Details</v-btn
>
</v-flex>
..
.
.
.
.
.
async fetchSocietyData() {
await this.$store.dispatch("societystore/fetchSpecificSocietyDetails", {
id: this.id,
});
// console.log(this.id);
},
它在不分派的情况下导航到页面,如果我删除路由 (:to),它会成功分派。 任何帮助将不胜感激:) .
答案 0 :(得分:0)
在你的 fetchSocietyData
方法中,你可以有类似的东西
await this.$store.dispatch("societystore/fetchSpecificSocietyDetails", {
id: this.id,
})
this.$router.push({ path: `societies/${this.sname}` })
通过这种方式,您正在执行操作,等待它完成,然后以编程方式进行导航。
更多信息请访问:https://router.vuejs.org/guide/essentials/navigation.html#router-push-location-oncomplete-onabort
当然,在导航之前确保操作成功可能是一件好事。
顺便说一句,监听器应该是@click="fetchSocietyData"
,不需要括号,否则你可能会出现一些意想不到的行为。