v-for動态添加表單,并且擷取表單中的值

vue是資料驅動視圖，是以要想改變頁面的結構，就要首先改變資料。
要想動态添加一個input表單，每當你點選的時候，添加一個資料在數組裡面。
 handler(mess){
    this.list.push("jo")
 },

要想獲得目前這個表單裡面的值，我當初想的是v-model，去綁定。發現不可以。這就尴尬了。
整了一會，在百度上查找了一些資料。
還是沒有對應的案例。可能是我百度的方法是不正确。

最後，還是決定使用原生的js
給表單綁定一個id。在失去焦點的時候，得到這個input框中的值。
 let aa=document.getElementById("demo"+mess).value;
           

<template>
    <div>
       
     <div v-for="(item,index) in list" :key="index" class="demo">
         <input type="text" :id="`demo${index}`">
         <button @click="handler(index)" @blur="getterValue(index)">添加</button>
     </div>

    </div>
</template>

<script>
    export default {
        data(){
          return{
            list:["12"]
          }
        },
        methods:{
            handler(mess){
                this.list.push("jo")
            },
            getterValue(mess){
                let aa=document.getElementById("demo"+mess).value;
                console.log("得到的值是", aa)
            }
        }
    }
</script>
           

我們公司正在尋找前端和後端，感興趣的小哥哥或者小姐姐可以私聊我

如果你是大佬，請帶我們飛

如果你是菜鳥，我們帶你飛

僅限成都

作者：明月人倚樓

出處：https://www.cnblogs.com/IwishIcould/

想問問題，打賞了卑微的部落客，求求你備注一下的扣扣或者微信；這樣我好聯系你；(っ•̀ω•́)っ✎⁾⁾！

如果覺得這篇文章對你有小小的幫助的話，記得在右下角點個“推薦”哦，或者關注部落客，在此感謝！

萬水千山總是情，打賞5毛買辣條行不行，是以如果你心情還比較高興，也是可以掃碼打賞部落客(っ•̀ω•́)っ✎⁾⁾！

支付寶

微信

本文版權歸作者所有，歡迎轉載，未經作者同意須保留此段聲明，在文章頁面明顯位置給出原文連接配接

如果文中有什麼錯誤，歡迎指出。以免更多的人被誤導。