Vue /路由器：如何在呈现页面内容之前正确获取数据？

我正在将Nuxt与Vue Router和Axios结合使用。我看到Vue Router具有称为导航卫士的出色功能。

不幸的是，在下面的示例中，beforeRouteEnter()调用了我的函数，但是似乎在next()调用手动方法之前退出并切换了页面fetchPageData(next)。

这里的正确模式是什么？

export default {
    beforeRouteEnter (to, from, next) {
        next(vm => {
            vm.fetchPageData(next);
        });
    },
    methods: {
        async fetchPageData(next) {
            const result = await this.$axios.$get('/api/v2/inventory/3906?apiKey=f54761e0-673e-4baf-86c1-0b85a6c8c118');
            this.$store.commit('property/setProperty', result[0]);
            next();
        }
    }
}

我假设我的第一次调用next(vm => {})是异步运行的，从而允许执行继续，从而导致页面更改，然后我（很可能是错误地）尝试回调next（）。