图1

1：增改查

其实本质上是用了同一个方法，也就是edit（），具体区别就是，

图2

一：查（handleDetail）多了一个

this.$refs.modalForm.disableSubmit = true;

所以不可选中，即也不可编辑

二：查（handleDetail）和改（handleEdit并非edit）在传参的时候有一个record（这个record应该是这一条数据中的所有数据），因为它们需要对目标数据进行操作

三：增和查和改，因为三个方法最终本质上都是调用edit（）方法，而这个方法里面有一个

this.form.resetFields();

这个是将表单重置的方法，又因为改和查传了record为参数，因为这一句

this.model = Object.assign({}, record);

所以重新在表单里面填了值。

2：删

删除功能调用了接口deleteAction，传的参数是一个url和要删除的数据的ID，具体见图1，url暂时码住

3：pick（）

该函数的功能是：返回一个只有列入挑选key属性的对象。其中，参数object为JSON格式的对象，*keys表示多个需要挑选出来的key属性。示例如下。

var data = {       A: 1,       B: 2,       C: 3,       D: 4   }   

var newdata = _.pick(data, 'B', 'C');   

console.log(newdata);

在上述代码中，先定义一个名为data的对象，该对象中包含4个属性，分别为A、B、C、D；然后调用pick()函数，挑选key的属性为B、C，并将返回的对象赋予变量newdata；***，在控制台输出该对象的内容。最终在Chrome浏览器的控制台输出的效果如图2-24所示。

从图2-24中可以看出，挑选key属性后，返回一个新的对象，该对象包含被挑选的全部key属性和value值