一、循环实现一个列表的展示及删除功能

1.1 列表展示

1、背景：

完成一个这样的列表展示。使用v-for 循环功能

 2、实现代码

id
接口名称
测试人员
项目名
项目id
描述信息
创建时间
用例数
{{item.id}}
{{item.name}}
{{item.tester}}
{{item.project}}
{{item.project_id}}
{{item.desc}}
{{item.create_time}}
{{item.testcases}}

1.2 列表删除的功能

给上面的列表，添加一个删除功能，绑定事件。

id
接口名称
测试人员
项目名
项目id
描述信息
创建时间
用例数
操作
{{item.id}}
{{item.name}}
{{item.tester}}
{{item.project}}
{{item.project_id}}
{{item.desc}}
{{item.create_time}}
{{item.testcases}}
删除

注意，列表删除功能的两种方式。

方式一 通过 filter过滤实现

				methods: {del:function(id) {this.list=this.list.filter(function(item,index){return item.id != id})},},

注意，function（item,index)。 item是列表中，每一个元素，index是索引，这个索引是固定写法。

方式二 通过删除索引实现

				methods:{del:function(id){// 查找要删除的数据索引值let index = this.lists.findIndex(function(item){return item.id==id})// 根据数组的索引去删除数组中对应的数据this.lists.splice(index,1)}}