[英]Nested loop to v-model Vue JS
I want to collect the data from input with v-model on nested loop, but idk how to do it cause i'm new in Vue.我想在嵌套循环中使用 v-model 从输入中收集数据,但是我不知道该怎么做,因为我是 Vue 的新手。
Here's the code for the component:这是组件的代码:
<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>
With v-model="day.inputs[n_key]"
使用
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>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.