首先,开发这么一个搜索记录的功能很简单,只需要用到uni-app中的两个数据缓存接口,一个是存储数据uni.setStorage(OBJECT),一个是获取数据uni.getStorage(OBJECT)。
细节:需要注意的是存储数据的时候this的指向!
<input type="text" focus v-model="changeVaule" @confirm="searchFun"/>
onLoad() {
const than = this // 注意this的指向
uni.getStorage({
key: 'searchAll_key',
success(res) {
than.searchAll = res.data
}
})
},
data() {
return {
changeVaule: '', // 输入框输入的值
searchAll: [] // 搜索记录
}
},
methods: {
searchFun() {
if(this.changeVaule != '') { // 输入框的值不为空时
const than = this
this.searchAll.push(this.changeVaule) // 将输入框的值添加到搜索记录数组中存储
uni.setStorage({
key: 'searchAll_key',
data: than.searchAll,
success: function () {
}
})
this.changeVaule = ''
}
}
}