Javascript 隐藏子组件/路由，直到在Vue.js中调用

我知道子组件是在父

render（）

函数中调用的，但是有没有办法隐藏它，直到它被调用为止，比如说，通过按钮调用

说这是你的路由器文件

{
    path:'/products',
    name: 'Products',
    component: Products,
    children: [
      {
        path: ':subtype',
        name: 'Subtype',
        component: ItemSubtypes
      }
    ]
  },

现在，假设我想隐藏子类型，直到单击按钮转到

/products/Subtype

。有没有办法做到这一点，或者我不需要使用子路由

---

原因是，当您仅访问

/products

时，子类型的组件没有数据，因此为空。如果可能的话，我宁愿现在还不渲染它。

使用

v-if

，在加载数据之前，条件将为false。或者在单击按钮后将标志设置为truthy，最初为false。

通常，组件上的

v-if

应该足以停止渲染，直到事情准备就绪。那么，我应该在组件标记上运行v-if吗？如果我想返回到第一个父页面，我应该如何重置数据，使其在单击按钮之前保持隐藏？对不起，我不明白，您可以详细说明一下吗？假设我单击按钮，它出现了，但是它使用一个变量更新它，所以将isShown设置为true，但是当我返回时isShown仍然为true，那么如何在页面加载或组件加载时将其值恢复为false，而不破坏按钮单击和子组件呈现？那么在导航中，为什么不再次将其设置为false呢。你已经知道了吗？