1、為了防止位元組抖動

1 npm i --save lodash

2、

1  <Input
2         icon="ios-search"
3         placeholder="搜尋"
4         style="width: 200px"
5         v-model="searchItem"
6       />
7 <Table border :columns="columns" :data="devices"></Table>

3、js

 1 <script>
 2 import _ from "lodash
 
";
 3 var vm = {};
 4 var doSearch = _.debounce(function (val) {
 5   if (val) {
 6     val = ("" + val).trim();
 7     vm.devices = vm.searchedDevices.filter((item) => {
 8       return (
 9         item.device_id.indexOf(val) !== -1 ||
10         (item.device_name && item.device_name.indexOf(val) !== -1
 
)
11       );
12     });
13   } else {
14     vm.devices = vm.searchedDevices;
15   }
16 }, 500);
17 
18 export default {
19   data() {
20     vm = this;
21     return {
22         searchItem : "", // input
23         devices : [], //table表中的資料
24         searchedDevices : []
25     },
26     methods: {
27
 
         featch(){
28             // result.data 為介面獲取的資料
29             this.devices = result.data;
30             this.searchedDevices=result.data;
31         }
32     },
33     watch: {
34         searchItem: function (val, oldVal) {
35           doSearch(val);
36         },
37      },
38 }
39 </script>