elementUI vue 动态渲染未知个输入框，并做未知个输入框的表单验证，动态新增删除输入框

//接口返回的数据结构
"data": {
		"basicInfo": {
		  xxx
		},
		"directionList": [
			{
				"customId": "",
				"paramValue": "",
			}
		],
	},

              
定向配置
              

                
                  
                    
                  
                
                
                  
                
              
              
删除定向配置

              
添加定向配置
            

//data
data(){
    return{
        formData: {
        basicInfo: {
          appId: '',
          paramKey: '',
          paramName: '',
          paramType: '',
          targetAppIds: []
        },
        directionList: [] // customId: '', paramValue: ''
      },
    }
}


//rules
rules:{
     directionList: {
          customId: [
            { required: true, message: '请选择用户群', trigger: 'change' }
          ],
          paramValue: [
            { required: true, message: '请输入下发值', trigger: 'blur' },
            {
              validator: (rule, value, callback) => {
                this.validateFn(this.formData.basicInfo.paramType, { rule, value, callback })
              },
              trigger: 'blur'
            }
          ]
        }
}


//保存表单，提交的directionList参数为 
directionList: this.formData.directionList

//get回显数据，直接塞到formdata
getForm(id).then(res => {
          this.formData = res.data
        })


//删除动态的input
deleteDirection(index) {
      this.formData.directionList.splice(index, 1)
    },


//动态添加input
addDirection() {
      this.formData.directionList.push({
        customId: '',
        paramValue: ''
      })
    },