我们在获取后端数据的时候,有时候会在列表中生成很多的input,而我们又想实时监听这些input,有些同学用的watch监听,但我觉得数据太多的话用watch也不好写,就比如我下面的这种,

<tr v-for="(item,index) in bstp" v-if="bstp">
    <td><input type="text" name="" id="input" class="form-control" @input="newVal(index,item.value)" min="0" step="" required="required" title="" v-model="item.value" ref="value"></td>
    <td><button type="button" class="btn btn-success btn-sm" @click="amendCardNum(index)">修改</button></td>
</tr>

一开始我也想用wath,但感觉特别蛋疼,最后还是用了常用的oninput,而我这个还要控制,输入必须是大于0的数字,所以我就加了个方法写成了这样


newVal(index,v){
    let n=parseInt(v);
    if(n<0 || isNaN(n)){
        n=0;
    }
        this.bstp[index].value=n;
}

监听多个从后端获取的input数据的小伙伴们可以参考下,当然前提是没有更好的方法的情况下,我觉得这个还挺好用的!


蓝调爵士
93 声望6 粉丝

好看的皮囊千篇一律,有趣的灵魂万里挑一。