vue uni-app搜索记录 解决关键字前后顺序的问题

功能：搜索之后记录数据，把最后一个显示在第一个 

 

 

1. data 中的 historyList 不做任何修改，依然使用 push 进行末尾追加

2. 定义一个计算属性 historys，将 historyList 数组 reverse 反转之后，就是此计算属性的值：

computed: {
  historys() {
    // 注意：由于数组是引用类型，所以不要直接基于原数组调用 reverse 方法，以免修改原数组中元素的顺序
    // 而是应该新建一个内存无关的数组，再进行 reverse 反转
    return [...this.historyList].reverse()
  }
}

3.页面中渲染搜索关键词的时候，不再使用 data 中的 historyList，而是使用计算属性 historys：

<view class="history-list">
  <uni-tag :text="item" v-for="(item, i) in historys" :key="i"></uni-tag>
</view>

 

vue uni-app解决关键词重复的问题，搜索记录功能https://blog.youkuaiyun.com/SmartJunTao/article/details/123682087