vue +element组件，对数组 进行 传参查询过滤，模糊匹配

后端返回数组，vue+element组件需要前端进行传参搜索查询过滤,模糊匹配

例子：

<template>

 <el-input placeholder="搜索应用名称" v-model.trim="searchText" clearable>

            <template #suffix>

              <div class="search-input-icon" @click="searchList">

                <i class="el-icon-search"></i>

              </div>

            </template>

  </el-input>

<p v-for="item in list" :key="item.id">{{item.name}}</p>

</template>

<script>

export default {

  data() {

    return {

      searchText: "",

        listAll：[{name:'111',id:1,title:'测试1'}，{name:'222',id:2,title:'测试2'}]，

        list ：[]

    }

}，

  watch: {

    searchText(val) {

      if (!val) {

        this.list = this.listAll;

      } else {

        this.list = this.searchvalue(this.listAll, this.searchText);

      }

    },

  },

  methods: {

    //模糊搜索

    searchvalue(list, keyWord) {

      if (keyWord !== "") {

        var reg = new RegExp(keyWord);

        var arr = [];

        for (var i = 0; i < list.length; i++) {

          if (reg.test(list[i].name)) {

            //这里匹配的是数组中需要的的内容，可根据业务需求自行修改！

            arr.push(list[i]);

          }

        }

        return arr; //返回符合条件的数组

      } else {

        return list;

      }

    },

}

},