Вложенный цикл в v-модель Vue JS

Я хочу собирать данные из ввода с помощью v-модели во вложенном цикле, но не знаю, как это сделать, потому что я новичок в Vue.
Вот код для компонента: 

        <div
            class="date-item"
            v-for="(day,index) in dateList"
        >
          <div class="mt-4">
            <div class="form-group">
              <ul class="list-task">
                <li v-for="(n,n_key) in 10" :key="n_key">
                  <base-input
                      :id="'input-text'+n"
                      :type="'text'"
                      :disabled="day.isPastDay"
                  />
                </li>
              </ul>
            </div>
          </div>
        </div>

Anyone can help how i created a v-model and data variable for this case ?

javascript loops vue.js v-model v-for
person dev0910    schedule 13.06.2021    source источник
comment
in 10 это не модель, к чему привязать?   -  person Lawrence Cherone    schedule 13.06.2021
comment
stackoverflow.com/questions/43364487/, это поможет   -  person Deepinder Singh    schedule 13.06.2021
comment
@LawrenceCherone, я все еще пытаюсь собирать данные с каждого входа   -  person dev0910    schedule 13.06.2021
comment
@DeepinderSingh, спасибо, но у меня есть 2 цикла для ввода, поэтому он просто меняет все 10 входов   -  person dev0910    schedule 13.06.2021

Ответы (1)


arrow_upward
1
arrow_downward

С v-model="day.inputs[n_key]"

new Vue({
  el: '#app',
  data: () => ({
    dateList: [{
      isPastDay: false,
      inputs: []
    }]
  })
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.14/vue.min.js"></script>

<div id="app">
  <div class="date-item" v-for="(day,index) in dateList">
    <div class="mt-4">
      <div class="form-group">
        <ul class="list-task">
          <li v-for="(n,n_key) in 10" :key="n_key">
            <input type="text" v-model="day.inputs[n_key]" :disabled="day.isPastDay" />
          </li>
        </ul>
      </div>
    </div>
  </div>
  
  <pre>{{ dateList }}</pre>
</div>

person Community    schedule 13.06.2021