uni-app动态添加表单控件

需求：

点击

选择

点击➖号可以删除一栏

view层

<view v-for="(tab,index) in tabs" :key="index">
	<view class="uni-list-line">
		<view class="uni-list-pro">{{ tab.pro }}</view>
			<input type="text" placeholder="请输入" 
            v-model="tab.value" class="uni-list-mes" />
            <input type="button" class="reduce" @click="remove(index)"/>
	</view>
</view>

JS层

export default {
		data() {
			return {
				company: "宁波吃炸鸡技术有限公司",
				phone: "11212121200",
				name: "",
				job: "",				
				index: 0,		//生成表单的索引						
				tabs: [],		//生成表单所有生成对象的数组,[{},{},{}]					
				tabObj: {},		//存放每一个生成表单对象
				proName: ['手机号', '邮箱', '微信', 'QQ'],
			}
		},
		components: {
		},
		methods: {
			addInner(e) {
				this.index += 1;
				this.tabs.push({
					id: this.index,
					value: ``,
					pro: `${this.proName[e]}`
				});
				console.log(this.tabs);
			},
			remove(index){
				this.tabs.splice(index,1);
			},			
			open() {
				uni.showActionSheet({
					title: "请选择你的操作",
					itemColor: "#3C64DA",
					itemList: ['手机号', '邮箱', '微信', 'QQ'],
					success: (res) => {
						this.addInner(res.tapIndex)
						console.log('选中了第' + (res.tapIndex + 1) + '个按钮');
					},
					fail: (res) => {
						console.log(res.errMsg);
					}
				});
			},
			show() {
				console.log(this.tabs);
			}
		}
	}