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，您可以检查（例如）商店，以查看是否定义了与付款相关的数据。