vue+element+ui+表单动态渲染+可视化配置的方法+事件怎么添加？

<template>
<el-form :model="formData" :rules="formRules" ref="form">
<el-form-item v-for="(item, index) in formConfig" :label="itemlabel" :key="index">
<template v-if="itemtype === 'input'">
<el-input v-model="formData[itemfield]" :placeholder="itemplaceholder" @input="handleInput(itemfield)" />
</template>
<template v-else-if="itemtype === 'select'">
<el-select v-model="formData[itemfield]" placeholder="请选择" @change="handleSelect(itemfield)">
<el-option v-for="option in itemoptions" :key="optionvalue" :label="optionlabel" :value="optionvalue" />
</el-select>
</template>
<!-- 其他表单元素类型 -->
</el-form-item>
</el-form>
</template>
<script>
export default {
data() {
return {
formConfig: [], // 表单数据结构
formData: {}, // 表单数据
formRules: {} // 表单验证规则
}
},
methods: {
handleInput(field) {
// 处理输入框 input 事件
},
handleSelect(field) {
// 处理下拉框 change 事件
}
// 其他事件处理函数
}
}
</script>

v-model指令的详细用法--收集表单数据
收集表单数据：
1文本框：<input type="text"/>，v-model收集的是value值，用户输入的就是value值。
2单选框：<input type="radio"/>，则v-model收集的是value值，且要给标签配置value值。
3多选框：<input type="checkbox"/>
31没有配置input的value属性，那么收集的就是checked（勾选 or 未勾选，是布尔值）
32配置input的value属性:
(1)v-model的初始值是非数组，那么收集的就是checked（勾选 or 未勾选，是布尔值）
(2)v-model的初始值是数组，那么收集的的就是value组成的数组

v-model的三个修饰符：
lazy：失去焦点再收集数据
number：输入字符串转为有效的数字
trim：输入首尾空格过滤

---