methods. The result is that the first writing method of v-model is normal, and the second is not correct. The reason for solving the problem is
. effect of the first way of writing:
:
<template>
<div style="width:100%;overflow:hidden;">
<ul class="list">
<li v-for="(item, index) in arrs">
<input
type="number"
v-model="item.customItem"
@input="changeFunc(item, index)"
/>
</li>
</ul>
<button @click="newadd"></button>
</div>
</template>
<script>
export default {
data () {
return {
arrs: [{
"value": 1,
"customItem": 1
},{
"value": 2,
"customItem": 2
}],
na: {
value: "",
customItem: ""
}
}
},
methods: {
newadd() {
newadd() {
//
// this.arrs.push({
// value: "",
// customItem: ""
// });
// v-model
this.arrs.push(this.na);
console.log(this.na)
},
changeFunc(item, index) {
this.arrs[index].customItem = item.customItem;
this.watchVal();
},
//
watchVal() {
const arrs = this.arrs;
if (arrs.length > 0) {
for (let i = 0; i < arrs.length; iPP) {
let customItem = arrs[i].customItem;
if (customItem * 1 < 0) {
this.$set(this.arrs[i], "customItem", 0);
}
}
}
}
}
}
</script>