Могут ли Vue приложения быть вложенными? - PullRequest
Новая
       9

Могут ли Vue приложения быть вложенными?

1 голос
/ 10 февраля 2020

У меня есть монолитный c SPA, который я пытаюсь модулировать. Первым шагом было разбиение на отдельные vue приложения. Теперь я хотел бы представить маршрутизатор Vue и, следовательно, использовать компоненты Vue. Мой основной компонент по-прежнему не более чем обертка вокруг двух Vue приложений.

Возможно ли вложить Vue приложения в компонент или мне нужно преобразовать эти приложения в компоненты, даже если они действительно одиночные и не предназначены для многоцелевого использования?

Так что в основном , что-то вроде этого возможно, когда sub-app-N - это Vue приложения, похожие на основное приложение app: 

<div id="app">
    <nav>
        <router-link to="/">Main</router-link>
        <router-link to="/settings">Settings</router-link>
    </nav>
    <router-view></router-view>
</div>

<script type="text/x-template" id="main-template">
<div>
    <div id="sub-app-1"></div>
    <div id="sub-app-2"></div>
</div>
</script>

<script>
const routes = [
    { path: "/", component: main },
    { path: "/settings", component: settings },
];

const router = new VueRouter({
    routes // short for `routes: routes`
});

const app = new Vue({
    router
}).$mount('#app');

const subapp1 = new Vue({
  el: '#sub-app-1',
  ...
});

const subapp2 = new Vue({
  el: '#sub-app-2',
  ...
});
</script>
...