монтировать приложения Vue в контейнер основного приложения Vue - PullRequest
5 голосов
/ 27 сентября 2019

Я хотел бы создать базовое приложение Vue, обеспечивающее основные функции, такие как вход в систему, навигация по боковой панели и т. Д. Но элементы навигационной панели должны быть взаимозаменяемыми.Я хочу создать отдельные приложения Vue, представляющие эти элементы панели навигации.


Основная идея: API REST и базовый контейнер (приложение Vue), который может отображать другие приложения Vueв конкретном элементе div, должен быть предоставлен.Это позволило бы другим добавлять свои собственные веб-приложения и работать с этим API, если они захотят.Поэтому я просто предоставлю несколько основных приложений.Основная идея заключается в создании Plug & Play системы для очень модульной системы администрирования.Я предоставлю процесс регистрации для этого пользовательского приложения, чтобы API знал это приложение и его базовый URL, а мое базовое приложение могло получить все эти приложения.


Настройка базового приложения

Таким образом, мое базовое приложение предоставляет маршрут для этих пользовательских приложений

{
  path: '/app/*',
  component: CustomAppContainer,
},

и будет отображать это представление

<template>
  <div id="customAppContainer">Render custom apps here</div>
</template>

, и моя навигационная панель может предоставить ссылку /app/one для навигациии визуализировать приложение с именем 'one' в этом customAppContainer.


Настройка пользовательского приложения

При определении моих маршрутов мне нужно установить baseurl

export default new Router({
  base: '/one/',
  routes: [
    {
      path: '/',
      component: Home,
    },
  ],
});

, но для main.js Я не уверен, как его настроить.Я думаю, что мне нужно обновить это что-то вроде

new Vue({
  router,
  render: h => h(CustomAppContainer),
}).$mount('#customAppContainer');

, но, очевидно, это приложение не знает CustomAppContainer и #customAppContainer.


Далее я думаю одистрибутив, когда у меня есть только несколько index.html файлов и я хочу интегрировать один в другой.Итак, как я могу развернуть базовое приложение, и когда пользователь хочет получить доступ к пользовательскому приложению через /app/myCustomApp, я монтирую пользовательское приложение в customAppContainer?

Пожалуйста, дайте мне знать, если вам нужна дополнительная информация!

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...