Vue3怎么实现点击菜单出现（和路由绑定的）固钉？

Question

如上图所示，该怎么实现这种效果啊？
根据我的分析，是点击菜单的一项，在一个固定位置出现固钉，同时router-view也改变。消掉一个固钉，路由回退。我的困惑在于怎么实现的多个固钉和路由回退？

Answer 1

const routes = [
  {
    path: '/',
    component: Home,
    meta: {
      showPin: false // 是否显示固钉
    }
  },
  {
    path: '/about',
    component: About,
    meta: {
      showPin: true // 显示固钉
    }
  },
  // 其他路由...
]