vue里input的@input有什么用

在 Vue 中，`@input` 是一个组件事件，用于监听输入框的输入事件。当用户在输入框中输入内容时，`@input` 事件会触发，可以通过该事件获取用户输入的内容，并进行相应的处理。

例如，我们可以通过 `@input` 事件来实现实时搜索功能。当用户在搜索框中输入关键字时，通过监听 `@input` 事件来获取输入框中的内容，然后将关键字发送到后端进行搜索，并将搜索结果展示给用户。这样用户就可以实时查看搜索结果，提高了用户体验。

示例代码：

<template>
  <div>
    <input type="text" v-model="keyword" @input="handleInput" />
    <ul>
      <li v-for="item in searchResult" :key="item.id">{{ item.title }}</li>
    </ul>
  </div>
</template>

<script>
export default {
  data() {
    return {
      keyword: '',
      searchResult: []
    }
  },
  methods: {
    handleInput() {
      // 发送关键字到后端进行搜索
      // 更新搜索结果
      this.searchResult = [...];
    }
  }
}
</script>

在上面的代码中，我们通过 `v-model` 绑定了输入框的值到 `keyword` 属性上，然后通过 `@input` 事件监听输入框的输入事件，当用户输入内容时，调用 `handleInput` 方法进行搜索，并更新搜索结果。最终将搜索结果展示给用户。