vue2前端input搜索功能

<template>
  <div>
    <el-input
      v-model="input"
      placeholder="请输入内容"
      style="width: 200px"
    ></el-input>
    <el-button type="primary" style="margin-left: 20px" @click="search"
      >搜索</el-button
    >
  </div>
</template>

<script>
import { searchApi } from "@/api/user"  //"@/api/user" 这个地方你们的路径 跟我的不一样 要换成自己的接口路径
export default {
  data () {
    return {
      input: '',
      // 首页便利的数组
      list: []
    }
  },
  methods: {
    async search () {
      await searchApi(this.input).then(res => {
        // res是后台返回来的数据
        console.log(res)
        // 把搜索出来的数据 复制给首页便利的数组
        this.list = res.data.data
      })
    }
  }

}
</script>