uniapp实现动态增删元素

<template>
	<view>
		<view class="item-box" v-for="(item, index) in list">
			<input type="text" placeholder="请输入">
			<button type="warning" @click="delItem(item)">删除</button>
		</view>
		<button type="primary" @click="addItem">新增</button>
		
		<button type="primaray" @click="submitBtn">提交</button>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				id: 1,
				list: [
					{
						id: 1
					}
				]
			}
		},
		methods: {
			addItem() {
				let add = {
					id: parseInt(this.id)+1
				}
				this.list.push(add)
				this.id = parseInt(this.id)+1
			},
			delItem(item) {
				if (item.id == 1) {
					uni.showToast({
						title: '不能删除第1个',
						icon: 'none'
					})
					return false;
				}
				this.list = this.list.filter((i) => {
					return i != item
				})
			},
			submitBtn() {
				console.log(this.list)
			}
		}
	}
</script>

<style>
	.item-box{
		display: flex;
	}
</style>