使用el-input做搜索框

您可以使用 Element UI 中的 el-input 组件来创建一个搜索框。首先，确保已经安装了 Element UI，并将其导入到您的项目中。然后，您可以按照以下步骤创建搜索框：

1. 在需要使用搜索框的组件中，引入 el-input 组件：

<template>
  <el-input v-model="searchText" placeholder="请输入关键字" @keyup.enter="search"></el-input>
</template>

2. 在 data 中定义 searchText 变量，用于存储用户输入的关键字：

<script>
export default {
  data() {
    return {
      searchText: '',
    };
  },
  // ...
};
</script>

3. 在 methods 中定义 search 方法，用于处理用户的搜索操作：

<script>
export default {
  // ...
  methods: {
    search() {
      // 处理搜索逻辑，例如向后端发送请求获取搜索结果
      console.log('搜索关键字：', this.searchText);
    },
  },
};
</script>

在上述代码中，el-input 组件使用了 v-model 指令绑定了 searchText 变量，这样用户输入的值会自动同步到 searchText 中。@keyup.enter 监听回车键的按下事件，当用户按下回车键时，会触发 search 方法。

您可以根据实际需求修改搜索逻辑，例如发送 AJAX 请求获取搜索结果，并将结果展示在页面上。

希望这可以帮助到您！如果您有任何进一步的问题，请随时提问。