javascript - Vue 中类似浏览器的选项卡 - 怎么样？

Question

我计划开发一个学术组织者应用程序，您可以在其中添加选项卡，就像在浏览器中添加选项卡一样，但它是在应用程序的上下文中。每个选项卡都有自己的历史、路线、导航等。

我认为用 vue-router 实现这将是微不足道的，但再想一想，我不知道如何将路由器链接映射到可以更改的选项卡，因为路由通常只是一成不变的。

我还考虑为每个选项卡创建一个单独的路由器，但这似乎也有点有趣。有人可以帮我吗？

编辑：重要的是要注意该应用程序实际上不是网络浏览器。我只想要类似浏览器的选项卡，但在学术组织者应用程序的上下文中。

标签： javascriptvue.jstabsrouter

Answer 1

第一个想法。

使用一些现有的布局框架进行选项卡逻辑可能会更好。例如黄金布局

And when tab opens you can bootstrap into this tab vue.js app with vue-router in "abstract" mode .

对于状态管理，您可以使用事件总线或 vuex。但它必须是整个应用程序中唯一的一个。

第二个想法。

如果几个 vue.js 应用程序的引导看起来像是过度工程，那么您可以创建实现历史/导航基本功能的组件。该组件必须包装每个选项卡的内容。