uni-app - 详细实现搜索框+ 历史记录功能+点击历史记录快速重新搜索

<script>
export default {
  data() {
    return {
      historyList: [],
      searchKeyword: "", // 用于 v-model 绑定的搜索关键词
      productNames: ["测试1", "测试2", "测试3", "测试4", "测试5", "测试6"] // 初始搜索建议列表
    };
  },
  onLoad() {
    // 进入搜索页面时将存储在本地的历史记录取出并展示
    let history = uni.getStorageSync("history");
    if (history) {
      this.historyList = JSON.parse(history);
      console.log(this.historyList);
    }
  },
  methods: {
    handleInput(event) {
      this.searchKeyword = event.target.value;
    },
    doSearch() { // 应确保方法不带参数，使用内部的 searchKeyword
      if (!this.searchKeyword) return; // 如果没有搜索词，则不执行

      // 防止添加空字符串到历史记录中
      if (this.historyList.includes(this.searchKeyword)) return;