vue iview 表格table编辑时Object对象值的数据赋予深拷贝解决数据变化原数据修改问题

vue iview 表格table编辑时Object对象值的数据赋予深拷贝解决数据变化原数据修改问题

拓展参考：Object.assign()到底是浅拷贝还是深拷贝？【Object.assign()的用法】
使用Object.assign(target, datasource)
该方法用于对象的合并，将源对象（datasource）的所有可枚举属性，复制到目标对象（target）

拓展转：ES6 的学习笔记之Object.assign()

table:

			 <Table border
                    :columns="columns"
                    :data="infoData"
                    :loading="loadingTable"
                    :height="height-120">
                <template slot="action" slot-scope="{ row,index}">
                        <span>
                          <Button size="small" type="info" @click="editData(row,index)"
                          >编辑</Button
                          >
                          <Button size="small" type="error" @click="deleteData(row,index)"
                          >删除</Button
                          >
                        </span>
                </template>
            </Table>

js:

//编辑时点击获取的行数据
editData(data){
	//editInfo 是定义的编辑的数据 editInfo :{}
	this.editInfo = Object.assign({}, data)
}

编辑输入：

		<Form :model="editInfo " :rules="ruleValidate" :label-width="145" ref="formValidate">
                <Row v-if="isEdit" style="text-align:center;line-height: 47px;">
                    <i-col span="20">
                        <FormItem label="流量：" prop="nitrogenFlow">
                            <Input
                                    v-model="editInfo .nitrogenFlow"
                                    placeholder="请输入流量"
                                    style="width: 250px;padding: 0 5px"
                            />
                        </FormItem>
                    </i-col>

                    <i-col span="20">
                        <FormItem label="压力：" prop="maxPressure">
                            <Input
                                    v-model="editInfo .maxPressure"
                                    placeholder="请输入压力"
                                    style="width: 250px;padding: 0 5px"
                            />
                        </FormItem>
                    </i-col>
                </Row>
           </Form>