Vue：仅在以编程方式重定向到时才允许访问页面

Question

我有一个在用户完成付款后显示的路线，比如 /success URL。我怎样才能让某人不能简单地转到 example.com/success 并看到成功屏幕。相反，它应该只能由运行 this.$router.go('/success/'); 在代码中访问。

谢谢

Answer 1

看看Navigation Guards。

您可以在路由中添加一个 beforeEnter 以用于检查用户是否应该访问该页面。

const router = new VueRouter({
  routes: [
    {
      path: '/foo',
      component: Foo,
      beforeEnter: (to, from, next) => {
        // ...
      }
    }
  ]
})

Answer 2

您可以使用路由器导航守卫来做到这一点，特别是 in-component guards。通过定义 beforeRouteEnter，您可以检查（例如）商店，以查看是否定义了与付款相关的数据。

Vue：仅在以编程方式重定向到时才允许访问页面

Vue: only allow access to page if redirected to programatically

vue.js

vue-router

vuejs2