长话短说，我有一个网站正在慢慢迁移到 Vue。同一页面上有许多独立的小部件，每个部件都是自己的 Vue 应用程序。
\n我们需要将 Vuetify 添加到其中几个小部件中。例如，导航栏是它自己的 Vue 应用程序，然后页脚也是它自己的 Vue 应用程序。应用程序的架构还不允许我们将这些组合到一个应用程序中。
\n当您使用标签包装第二个应用程序时，将 Vuetify 添加到多个实例会破坏其他实例<v-app>，因为正如文档所述：
\n\nVuetify 不\xe2\x80\x99t 支持页面上多个独立的 Vuetify 实例。v-app 可以存在于应用程序主体内的任何位置，但是，应该只有一个，并且它必须是所有 Vuetify 组件的父组件。
\n
该<v-app>标签添加了一个data-app="true"属性，因此我尝试<body>通过硬编码将其添加到应用程序的标签中，如下所示：
<body data-app="true">\n但这似乎没有正确注册 Vuetify。
\n由于主应用程序不在根级别使用 Vue，因此我如何将所有这些应用程序包装为一个<v-app>并让 Vuetify 适用于多个实例？
根据下面的评论线程更新
\n应用程序的设置方式如下：
\n...\nimport vuetify from \'@/plugins/vuetify\';\nimport NavbarApp from \'@/apps/navbar/NavbarApp.vue\';\nimport OtherWidgetApp from \'@/apps/navbar/OtherWidgetApp.vue\';\n\nconst navbarAppRootEl = document.getElementById(\'navbarApp\');\nconst NavbarAppRoot = Vue.extend(NavbarApp);\n\nnew NavbarAppRoot({\n el: navbarAppRootEl,\n store,\n router,\n vuetify,\n propsData: {\n lang: config.lang,\n },\n i18n,\n});\n\nconst otherWidgetRootEl = document.getElementById(\'navbarApp\');\nconst OtherWidgetRoot = Vue.extend(OtherWidgetApp);\n\nnew OtherWidgetRoot({\n el: otherWidgetRootEl,\n store,\n router,\n vuetify,\n propsData: {\n lang: config.lang,\n },\n i18n,\n});\n其他应用程序使用上面相同的模式进行设置，这是两个应用程序的示例。
\n