Vue 路由器是否可以根据传递的参数显示不同的布局?



我想知道 Vue 路由器是否可以根据 URL 中传递的参数显示不同的布局?

请考虑以下网址:

/
  • admin/forms/pending
  • /
  • admin/forms/approved
  • /
  • admin/forms/deny
  • /
  • admin/forms/category

前 3 个链接与某些表单对象的状态相关,并将使用挂起/已批准/已拒绝状态将参数作为状态筛选器传递给表单 API。 但是,对于类别,我希望它显示一个列出所有类别的视图。

我知道这是可以通过拥有两个不同的路由对象来实现的 - 一个与/admin/forms/categories匹配,另一个与/admin/form/:status匹配,但我想知道是否可以将两者结合起来,或者有办法创建两个路由,这样我定义它们的顺序就无关紧要了(如果我把我的类别路由放在状态路由下面, 例如,类别视图将不会显示(。 为此,我认为类似(/admin/forms/(:status(?!categories))的东西会起作用,但是我从 Vue 路由器收到"没有什么可重复的"错误。

这是在 Vue 路由器中可以做的事情吗? 我很乐意继续定义两条不同的路线,只是想知道是否有更有效的方法

?谢谢!

=====

更新:不要问我为什么,但我在这里引用了 Vuex,而它应该是 Vue 路由器,哦

通过将参数传递给页面/admin/form/,您可以有两个组件,一个用于具有一种类型布局的前三个组件;一个用于具有不同布局的类别。 使用 v-if ...v-else 在它们之间切换。

最新更新