？elementUI的表单< titlesplit >如何使用？前端小伙伴有和我一样的烦恼，每次写个表格就烦。这东西没什么难度，纯手工活。项目中如果用到UI库，基本上每次都是按照官网例子复制粘贴。假设项目使用vue+elementUI，这种代码经常出现
data(){return{data1:0,data2:1,data3:2,data4:3,}}方法：{onchange(value){.........}}我故意写这个是为了简单。如果属性和事件多了，这个页面很可能会发展成我们以后做程序最怕的东西。.老板：“小陈，XXX离职了，你接手XXX档案，不难，就是有点乱，只有一万多行。”我心：“尼玛，明明几行代码加一个配置文件就搞定了，你摇摇我”开启重构之路（本文以vue+elementUI为例，主要是idea而不是代码）来分析代码，找出异同：elementUI中每一个表单元素的最外层都是
解决区别，最大的区别就是每个元素使用了很多个性化的属性和事件，而除了表单元素，
``也有很多属性和事件，如果这些都是通过props声明的，太多了，不容易分清谁属于谁。所以需要使用vue的$attrs和$listeners，通过$attrs和$listeners批量绑定属性和事件，修改formList的数据格式让formList=[{tag:'input',label:'name',model:'name',attrs:{//个性化属性type:'textarea'},listeners:{//个性化事件change:(value)=>console.log(value,'change'),blur:(value)=>console.log(value,'blur')}}]同时记得单独处理select标签，最终代码为```<组件v-model="formData[item.model]"v-on="item.listeners"v-bind="item.attrs":is="`el-${item.tag}`">```*注：本例默认全局注册elementUI*Effect效果代码
