应用场景

很多搜索场景内都能用到这个功能

大概就是用户搜索了某个关键字 然后搜索的关键字可以持久的保存下来

下次打开搜索的时候可以达到快速点击搜索的效果

实现步骤

1. 先给输入框双向绑定数据和事件

<input v-model="keyWord">

2. 给搜索按钮绑定点击事件

<button @click="search">搜索</button>

3. 在事件内去处理相关逻辑

methods: {search(){// historyList 为历史搜索的列表// 先做逻辑判断 keyWord 在history内是否存在 如果存在 就把原来的删除 把最新的添加到最前面// 如果不存在 就直接加到最前面this.historyList.unshift（this.keyWord）this.keyWord = ''// 把列表储存到本地uni.setStorageSync('historyList', this.historyList)}
}

4. 在页面加载的时候就从本地获取列表

onLoad(){this.historyList = uni.getStorageSync('historyList')
}

5. 把列表循环渲染到对应的位置