Использование компонентов Vue на экранах Moqui
Можно ли использовать компоненты VusJS в экранах Moqui? Я точно знаю, что вы можете рендерить Basic HTML, но я не смог найти хук для приложения VueJS.
Необходимость исходит из следующего сценария: хотя виджет с одной формой можно сделать разборным, нельзя сделать список форм. Поэтому я хотел использовать vue-collapsible ( https://github.com/vue-comps/vue-collapsible), но я не знаю, где я должен зарегистрировать компонент.
Если нет возможности использовать vue, может быть, вы поможете мне с моей конкретной проблемой.
1 ответ
В режиме рендеринга 'vuet', который используется в пути /vapps (в отличие от /apps), на самом деле это не HTML, отправляемый клиенту, это шаблон Vue. Если вы посмотрите на текст, возвращенный сервером, то увидите, что несколько Vue Components уже используются (см. Файл WebrootVue.js для их источника). Это можно увидеть в Chrome, используя вкладку "Источники" или "Сеть" в окне инструментов или аналогичные инструменты в других браузерах. Если вы осмотрите элемент, вы будете смотреть на визуализированный HTML, т.е. после того, как Vue запустит компоненты, чтобы изменить шаблон Vue на HTML.
Это означает, что если вы включите необходимые файлы JavaScript и файлы CSS, если это необходимо, то вы можете использовать любой компонент Vue в возвращенном шаблоне Vue. Вы можете сделать это inline в файлах XML Screen, используя элемент render-mode.text с @type=vuet.
Ничто из этого не работает под управлением NPM, так как VueJS используется в Moqui Framework через экраны XML. Другими словами, это не предустановленное приложение Vue со 100% рендерингом клиент / браузер, а скорее гибридный подход к клиенту и серверу.
Вы можете включать сценарии в этот гибридный подход Moqui, используя элемент script с атрибутом @src для файла сценария, который файл WebrootVue.js загружает на лету. Существуют различные примеры этого для дополнительных JS-скриптов, таких как Chart.JS