????????????????????vue v-for通過index動態(tài)綁定input輸入框的數(shù)據(jù)
? ? vue項(xiàng)目中經(jīng)常會遇到各種難題拆宛,比如v-for循環(huán)出來的input輸入框嗓奢,如果有多個個的話,
要怎么獲取他們相對的數(shù)據(jù)呢浑厚,又怎么確保獲取的數(shù)據(jù)和input輸入框一 一相同呢股耽,不要慌,答案在后面钳幅!
先看效果圖:
再看代碼:
<div style="margin-left:100px;">
? <ul>
? ? ? <li v-for="(item,index) in 3">
? ? ? ? <input type="text" v-model="data[index]" style="border:1px solid #ccc;height:50px;margin-top:10px;">
? ? ? </li>
? </ul>
? <button @click="clickMe" style="height:30px;line-height:30px;margin-top:20px;">點(diǎn)我試試</button>
</div>
<script>
? export default {
? ? data() {
? ? ? data:[]
? ? },
? ? methods: {
? ? ? clickMe(){
? ? ? ? console.log(this.data)
? ? ? },
? ? }
? }? ?
</script>? ?