Vue структурирование дочерних компонентов - PullRequest
Новая
       9

Vue структурирование дочерних компонентов

1 голос
/ 14 июня 2019

У меня есть проект vue, структурированный примерно так: 

Root app
   View 1
      ComponentA
         ComponentB
      ComponentA
         ComponentB
      ...
      ComponentA
         ComponentB

   View 2
      ComponentC
   View 3
      ComponentA
         ComponentB
   View4
      ComponentD
   ...

Вопрос касается конкретно ComponentB.Прямо сейчас, ComponentB является дочерним компонентом ComponentA.Проблема в том, что ComponentB загружается много раз на страницу, тогда как на самом деле его нужно загружать только один раз на страницу.Я хочу реорганизовать это, чтобы иметь одну копию ComponentB на страницу.В настоящее время я вижу два способа сделать это:

  1. Извлечь ComponentB как дочерний компонент ComponentA и добавить его в любое представление, которое может потребоваться (используя хранилище для управления глобальным состоянием). Сложность заключается в том, что мне придется добавить его в каждое отдельное представление, для которого может потребоваться компонент (для этого потребуется добавить его на многие страницы приложения, что не соответствует целям рефакторинга)

  2. Извлеките ComponentB и добавьте его в корневой компонент (App.vue). Сложность заключается в том, что он всегда загружается, даже когда пользователю это не нужно.

Есть ли лучший способ сделать это или общепринятый способзагружать компонент только тогда, когда он необходим (на основе триггера в магазине или другого типа триггера)?

...