Среда разработки:

Во-первых, я использую Vue 1.0 и Vueify 7.0.0, используя последний узел. js, npm и browserify для компиляции кода на машине с Ubuntu с локальным сервером Apache.

Проблема:

Я создал пользовательский компонент для {amp}lt;form-input/{amp}gt; который отображается без ошибок. Однако при попытке разместить их рядом друг с другом будет отображаться только один:

 {amp}lt;form{amp}gt; {amp}lt;form-input /{amp}gt; {amp}lt;form-input /{amp}gt; {amp}lt;form-input /{amp}gt; {amp}lt;/form{amp}gt; 

Чтобы получить несколько компонентов для рендеринга, я должен обернуть каждый из них в свой {amp}lt;div{amp}gt; .

 {amp}lt;form{amp}gt; {amp}lt;div{amp}gt;{amp}lt;form-input /{amp}gt;{amp}lt;/div{amp}gt; {amp}lt;div{amp}gt;{amp}lt;form-input /{amp}gt;{amp}lt;/div{amp}gt; {amp}lt;div{amp}gt;{amp}lt;form-input /{amp}gt;{amp}lt;/div{amp}gt; {amp}lt;/form{amp}gt; 

Для справки шаблон {amp}lt;form-input /{amp}gt; выглядит следующим образом:

 {amp}lt;template{amp}gt; {amp}lt;div class="input-group"{amp}gt; {amp}lt;label"{amp}gt;{amp}lt;/label{amp}gt; {amp}lt;input name="" class="form-control" type="text"{amp}gt; {amp}lt;/div{amp}gt; {amp}lt;/template{amp}gt; 

Не то чтобы это ужасно плохая проблема, но гораздо проще читать без лишних тегов {amp}lt;div{amp}gt; .

Вопрос:

Это ожидаемое поведение, потому что каждому компоненту нужен собственный элемент dom для привязки или я что-то упустил?

FYI:

Я также попытался обернуть шаблон дополнительным тегом div, но это не помогло. Я также не получаю никаких ошибок компиляции или выполнения во время написания шаблона.

Заранее спасибо.

Я не уверен, может ли это быть причиной проблемы, но самозакрывающиеся теги не рекомендуются создателем Vue.js: https://github.com/vuejs/vue/issues/1036 . У вас все еще есть проблема, если вы измените входные данные на {amp}lt;form-input{amp}gt;{amp}lt;/form-input{amp}gt; ?