在特定页面上渲染某些东西

【问题标题】：Render something on specific page在特定页面上渲染某些东西
【发布时间】：2021-05-11 21:29:00
【问题描述】：

所以我得到了这个 base.vue 布局，我在这里有我的顶部导航和其余内容，我想知道是否可以在粘性 div 中添加输入类型搜索并仅在特定路线页面上呈现它？例如，我不想在每个页面上都有搜索栏，而只是在我进入用户视图时才出现，我可以在其中过滤他们。

  .sticky.top-0.h-14.bg-white-200.shadow.px-8.flex.items-center
      input(type="search" placeholder="search)
    .container.max-w-full.mx-auto.p-8
      router-view

【问题讨论】：

标签： vue.js vuejs2 vuejs3

【解决方案1】：

在您的脚本中添加一个计算属性，用于检查当前路由路径是否为 /users：

computed:{
   isUsersPath(){
    return  this.$route.path==='/users'
  }
}

然后在模板中使用它：

 div(v-if="isUsersPath").sticky.top-0.h-14.bg-white-200.shadow.px-8.flex.items-center
      input(type="search" placeholder="search)
    .container.max-w-full.mx-auto.p-8
      router-view

【讨论】：