案例 — 搜索/删除/更改
最后更新于:2022-04-02 08:07:02
[TOC]
>[success] # 搜索和删除
~~~
1.这里单独把搜索和删除提出来,是因为两者有简易的方法的使用
2.删除和更改 这里推荐使用splice和index搭配
3.查询有种一种是一边输入一遍查询,一种格式点击查询,但注意都需要将总数据
和查询数据分开处理。切查询数据要copy总数据
4.第三条也不是绝对的可以通过计算属性来进行搜索数据
~~~
>[danger] ##### 删除案例
![](https://docs.gechiui.com/gc-content/uploads/sites/kancloud/318b3809aeb48af4f7b332c135de1324_108x92.png)
~~~
1.配合splice 使用,this.list.splice(index,1);第一个参数,起始位置,第二个参数,
删除的个数
~~~
~~~
Title
~~~
>[danger] ##### 更改
~~~
1.更改不做案例讲解因为在v-on的章节有讲解set和$set 的更改方式
2.还有一种是splice 的更改方式,详细的使用看前端手册对这个方法有讲解
~~~
>[info] ## 搜索
~~~
1.搜索有三种,第一种后台搜索,第二种前端搜索(点击按钮触发搜索),第三种前
端搜索(一遍输入一遍搜索)
2.这里不对后台搜素做探讨
3.但是搜索的时候需要另一个变量,专门讲搜索源数据和总数据进行分开的
~~~
>[danger] ##### 点击按钮搜索
![](https://docs.gechiui.com/gc-content/uploads/sites/kancloud/e0c197964d94ff32565d32143ef01745_272x133.png)
~~~
1.搜索推荐两个方法一个indexOf,一个是es6的includes
~~~
~~~
Title
~~~
>[danger] ##### 输入及搜索
![](https://docs.gechiui.com/gc-content/uploads/sites/kancloud/48bd891852a02673c80bf7920c9449a1_183x110.png)
~~~
1.通过计算属性进行搜索
~~~
~~~
Title
~~~
';
- {{item}}
- {{item}}
- {{i}}