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>

遇见问题，这是你成长的机会，如果你能够解决，这就是收获。

作者：​​晚来南风晚相识​​​

本文版权归作者所有，欢迎转载，未经作者同意须保留此段声明，在文章页面明显位置给出原文连接

如果文中有什么错误，欢迎指出。以免更多的人被误导。