Ant-Design-vue表单的编辑功能数据的回显

注意点：

        1. 需要将传入过来的数据进行深拷贝，否则在编辑弹框中修改数据会导致页面数据一起变化

        2. 在给a-form赋值时，需要调用this.$nextTick方法，否则会报错提示dom没有渲染，且赋值时需要按需赋值，这里调用lodash中的_.pick方法

        3. Ant-Design-vue中的<a-date-picker>组件他的值为一个Monent对象，在使用时或传入时都需要进行转换否则会报错。

      <a-form :form="addForm" :label-col="{ span: 5 }" :wrapper-col="{ span: 12 }" @submit="handleSubmit"><a-form-item label="姓名"><a-input v-decorator="['name', {rules:addRules.name}]"/></a-form-item><a-form-item label="年龄"><a-input v-decorator="['age',{rules:addRules.age}]"/></a-form-item><a-form-item label="出生日期"><a-date-picker style="width: 100%" v-decorator="['date',{rules:addRules.date}]" placeholder="请选择日期"format="YYYY-MM-DD"/></a-form-item><a-form-item label="地址"><a-input v-decorator="['address',{rules:addRules.address}]"/></a-form-item><a-form-item label="性别"><a-select v-decorator="['gender',{rules:addRules.gender}]"placeholder="请选择性别"@change="handleSelectChange"><a-select-option value="male"> 男</a-select-option><a-select-option value="female"> 女</a-select-option></a-select></a-form-item></a-form><a-table :data-source="data" style="margin-top: 20px"><a-table-column key="name" title="姓名" data-index="name"/><a-table-column key="age" title="年龄" data-index="age"/><a-table-column key="gender" title="性别" data-index="gender"/><a-table-column key="date" title="出生日期" data-index="date"/><a-table-column key="address" title="地址" data-index="address"/><a-table-column key="action" title="操作"><template v-slot="scope"><a-button @click="editUser(scope)">编辑</a-button><a-button type="danger" style="margin-left: 10px">删除</a-button></template></a-table-column></a-table>// 编辑按钮editUser(val) {this.modalType = 1this.visible = trueconst newForm = JSON.parse(JSON.stringify(val))this.$nextTick(() => {const pickedValues = _.pick(newForm, ['name', 'age', 'address', 'gender']);pickedValues.date = this.$moment(newForm.date, 'YYYY-MM-DD');this.addForm.setFieldsValue(pickedValues)})}