Интеграция vue на сайт написанный на backbone

234

30 января 2018, 11:43

Доброго времени. Есть сайт написанный на backbone и появилась задача расширить его функционал. Новый функционал - это достаточно объёмное модальное окно с множеством параметров и шагов.

Появилась идея использовать для данной части vuejs, но есть несколько вопросов по интеграции:

Как интегрировать vuejs только для определённой части сайта?
Если интеграция прошла успешно то получается, что vue следит за определённым куском DOM'a, и из этого выходит другой вопрос: этот кусок - это и есть модальное окно, но как выполнить его показ методами обычного js? (те как при нажатии кнопки где угодно на сайте запустить работу блока модалки под управлением vue?)

Я знаю что vue можно использовать без npm и node, те как я понял он будет работать непосредственно с DOM`ом, но недостаток такого подхода - это все компоненты в одном файле и отсутствие костомных компонентов(к примеру календаря и т.д).

Хотелось бы всё таки использовать npm webpack и тд.

Подскажите пожалуйста как бы вы подошли к решению такой задачи? Я немножко запутался и мне сложно понять как это сделать.

Answer 1

Кажется я нашел решение: корневой компонент кладём в window

window.modal = new Vue({
  el: '#app',
  data: {
    test: "test"
  },
  template: '<div>{{test}}<div>'
})

И теперь можно вызывать всё что угодно из window.modal (например window.modal.test = "hello"). Теперь я спокойно могу менять данный в компоненте vue, из любого другого места на странице.

Скажите: хорош ли такой подход?