用vue框架搜索框生成vue2格式template这种的代码无需任何文字说明只要源码即可

<template>
  <div class="search-box">
    <input type="text" v-model="searchValue" @input="handleInput" placeholder="请输入搜索内容">
    <button @click="handleSearch">搜索</button>
  </div>
</template>
<script>
export default {
  data () {
    return {
      searchValue: ''
    }
  },
  methods: {
    handleInput (e) {
      this.searchValue = e.target.value
    },
    handleSearch () {
      console.log('search value:', this.searchValue)
      // 进行搜索操作
    }
  }
}
</script>
<style scoped>
.search-box {
  display: flex;
  align-items: center;
}
.search-box input {
  flex: 1;
  margin-right: 10px;
  padding: 5px;
  border-radius: 5px;
  outline: none;
}
.search-box button {
  padding: 5px 10px;
  border-radius: 5px;
  border: none;
  background-color: #409EFF;
  color: #fff;
  cursor: pointer;
}
</style>