删除按钮:先删除为空的输入框,再从下往上删除输入框

在点击删除按钮时他总是将第一个输入框/输入框内有数据的给删除掉;所以将代码改写为‘先删除为空的输入框,再从下往上删除输入框’

<el-col :span="12">
	<el-form-item v-for="(item,index) of add" :key="index" label="Number">
		<el-input style="width: 100%" show-word-limit maxlength="8" v-model.trim="item.adds"
				  @change="addChange(index)"></el-input>
	</el-form-item>
	<div style="margin-top: -20px">
		<el-button icon="el-icon-circle-close" @click="delNumber"></el-button>
		<el-button type="primary" plain @click="naxtAdd">+</el-button>
	</div>
</el-col>
data(){
	return{
		add:[{
			adds:''
		}],
		base:{
			Number:''
		}
	}
}


delNumber(item, index) {
	if ( this.add.length <= 1 ) return false
	let addNull = 0;
	for ( item in this.add ) if ( !this.add[item].adds ) tapNull++
	if ( addNull > 0 ) {
		for ( item in this.add ) {
			if ( !this.add[item].adds ) {
				this.add.splice(item, 1)
			}
		}
	} else {
		this.add.splice(this.add.length - 1, 1)// 删除了数组中对应的数据也就将这个位置的输入框删除
	}
},
posted @ 2022-11-21 09:47  Clown&  阅读(49)  评论(0)    收藏  举报