vue为什么v-for的数据在input里打印不出来？

Question

现在遇到一个问题，我在表单里写了一些验证事件，在没有v-for插入数据的时候还能验证，但是v-for插入数据后，无论表单有没有字符打印的都是undefined，那就意味着我写的验证都无效了，求解？有v-for的时候打印undefined                   <div class="edit-form" v-for="(item,index) in listData" :key="index">                    <div>                        <input type="text"  @blur="onLeast1()" ref="Least1" v-model="item.name" >                        </div>                    </div>                                onLeast1() {            if (this.$refs.Least1.value !== '') {                console.log(this.$refs.Least1.value)                return false;            } else {                console.log(this.$refs.Least1.value)                return false;            }        }//有v-for数据的时候就是undefined没有v-for正常打印

Answer 1

有v-for的时候，this.$refs.Least1就变成了一个数组

ref的规则：

写在原生dom元素上，this.$refs.xx得到的是dom节点

写在组件上，this.$refs.xx得到的是这个组件的实例

写在v-for中，无论是单层v-for还是多层嵌套的v-for，this.$refs.xx得到的是一个数组

可以这样改一下

你是要验证都不能为空吗?

onLeast1() {

    return this.$refs.Least1.every( item => item.value !== '' )

}