纯前端实现搜索功能

1、搜索框

<el-input class="search" placeholder="标题" v-model="select_word" size="mini" style="width: 230px;" prefix-icon="el-icon-search">
</el-input>

2、设置teamDate为搜索后数据

  data () {
    return {
      tableData: [],
      tempData: [],
      select_word: '',

3、检测输入框内内容变化，并改变tableDate

  watch: {
    select_word: function () {
      if (this.select_word === '') {
        this.tableData = this.tempData
      } else {
        this.tableData = []
        for (const item of this.tempData) {
          if (item.title.includes(this.select_word)) {
            this.tableData.push(item)
          }
        }
      }
    }
  },