Есть таблица с данными. Каждую строку можно отредактировать в модальном окне. В этом окне часть элементов формы являются обязательными, часть необходимо создавать динамически. Данные полей приходят в момент открытия окна после ajax-запроса. С обязательными полями проблем нет. Они наполняются сразу после ответа сервера. А вот с динамическими всё сложней. Никак не могу сделать их корректный ввод в форму и наполнить данными.
Диалоговое окно:
<q-dialog v-model="formEditItem" persistent>
<q-card style="width: 1000px; max-width: 80vw;">
<q-card-section>
<div class="q-form-wrap">
<div class="row">
<div class="q-form-item col-4">
<div class="q-form-item__wrap">
<q-input filled v-model="editedItem.name" label="Наименование"/>
</div>
</div>
<div class="q-form-item col-4">
<div class="q-form-item__wrap">
<q-input filled v-model="editedItem.sku" label="Артикул"/>
</div>
</div>
<div class="q-form-item col-4">
<div class="q-form-item__wrap">
<q-input filled v-model="editedItem.code" label="Код"/>
</div>
</div>
</div>
</div>
</q-card-section>
</q-card>
</q-dialog>
Ответ сервера (JSON объект):
{
"name": "Тестовый товар",
"sku": "1234567890",
"code": "111111",
"weight": "0,013",
"country": "Китай",
}
Проброс полученного объекта в форму:
editItem(item) {
this.editedItem = Object.assign({}, item)
},
Как видно по коду, текстовые поля с name, sku и code заполняться без проблем. А как динамически добавить в форму под параметры weight и country текстовые поля и заполнить их данными в данной форме?