存搜索历史/微信小程序搜索历史缓存到本地

做微信小程序列表时遇到搜索,要把搜索的记录存到本地

利用 以下方式来存取

wx.setStorageSync(string key, any data) :string key本地缓存中指定的 key , any data是key对应的需要存储的内容。只支持原生类型、Date、及能够通过JSON.stringify序列化的对象

wx.getStorageSync(string key)   : string key本地缓存中指定的 key  返回值any data 就是key对应的内容

具体详见微信小程序api 

wx.setStorageSync(string key, any data) | 微信开放文档

any wx.getStorageSync(string key) | 微信开放文档

首先先定义一个存历史记录的变量

data: {
    historyDatas:'',//历史搜索
}

当页面加载时 先查询是否有搜索历史    cityHistoryKey就相当于key

这里 先判断是否有这个key,如果有,就把对应的内容先给history  如果没有 就先给存个空,最后个把这个值赋给历史记录的变量

onLoad: function (options) {
    var cityHistoryKey = 'cityHistory' + this.data.cityid // 这里cityid是城市值,我这里要分不同城市的历史记录
    var history = ''
    if(wx.getStorageSync(cityHistoryKey)){
      history = wx.getStorageSync(cityHistoryKey)
    }else{
      history = ''
      wx.setStorageSync(cityHistoryKey, [])
    }
    console.log('cityHistoryKey---',cityHistoryKey)
    this.setData({
      historyDatas:history,
    })
    console.log('搜索历史记录--',this.data.historyDatas)

}

定义一个添加历史记录的方法

addHistory(obj){//添加历史记录
    var historyname = 'cityHistory' + this.data.cityid  //先定好key的名字historyname
    var historydata = wx.getStorageSync(historyname) //和onload里一样取key

    //查看是否是重复搜索记录
    var historydataStr = JSON.stringify(historydata)
    console.log('historydata---',historydata)

    if(historydataStr.indexOf(obj.name) == -1){//通过name字段判断是否重复
        if(historydata.length < 10){ //只能存10条
          historydata.push(obj)
        }else{//删掉多余10条的
          historydata.shift()
          historydata.push(obj)
        }

        wx.setStorageSync(historyname, historydata)//存到缓存中 historydata就是存的内容

        this.setData({ // 把历史记录赋给事先定义好的变量就可以了
            historyDatas:historydata.reverse() //reverse() 起到倒序的作用,如果不加这个最新添加的历史记录在下面,所以我给前后顺序颠倒了一下
            //historyDatas:historydata
        })

    }


}

引用添加记录 比如点击热门榜单的时候  添加对应的记录

比如点击  公园十七区, 首先要先获取 ‘公园十七区’ 的对应信息,这里 获取到 name:公园十七区 , id:1,

<view 
    wx:for="{{hotkeywords}}" 
    wx:key="index" 
    bindtap="hotkeywordsclick" 
    data-name="{{item.estatename}}" 
    data-id="{{item.estateid}}">{{item.estatename}}<view>
hotkeywordsclick:function(e){//点击热门榜单
    var id = e.currentTarget.dataset.id;//获取id
    var name = e.currentTarget.dataset.name //获取name
    //保存历史搜索数据
    var historyObj = {
      id:id,
      name:name,
    }

    this.addHistory(historyObj) //调用存的方法,把值传进去

}

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值