Как записывать многомерные массивы из форм с помощью Vue?

Итак, у меня есть этот образец:

<div class="form-item">
  <label for="list-0"><?php _e('List 0', 'test'); ?></label>
  <input name="list[0]" type="text" id="list-0" value="">
</div>
<div class="form-item">
  <input type="checkbox" name="list[0][is-current]" id="list-0-current" value="yes">
  <label for="list-0-current"></label>
</div>

То, что я хотел бы иметь, выглядит примерно так:

list:[
    [value, is_current] // say 'John', yes
    ,[value, is_current] // say 'Francis', false
    ,[value, is_current] // say 'Bob', yes
]

В Vue вы можете использовать массивы в данных:

var vueapp = new Vue({
  el: '#form'
  ,data:{
    form:{
      list:[]
      //[...] etc..

Затем в ваших полях вы просто используете v-model="form.list"во всех полях списка. Но это только фиксирует плоский массив, в то время как мне нужен способ иметь мульти-один. Является ли это возможным? Как?

javascript,html,forms,vue.js,

1

Ответов: 1


0

Сделать объект:

 data: {
      form: [{}]
 },

Если это ваш массив:

list = [
    [value, is_current],
    [value, is_current],
    [value, is_current],
];

Затем перейдите по этому массиву и добавьте каждый внутренний массив к объекту:

  list.forEach(function(element) {
        that.form.push({value: element[0], key: element[1]});
  });

См. Эту скрипту для справки:

https://jsfiddle.net/mnd8ojLh/1/

JavaScript, HTML, формы, vue.js,
Похожие вопросы