如何做到本地缓存,使得下一次打开小程序后,仍旧能看到以前的数据,代码该如何实现?(附有源码)

wxml:

 <view class="header">
<image src="../../img/2.png" class="plus" bindtap="createTodoItem"></image>
<input class="input" name="input" maxlength="140" value="{{inputValue}}" placeholder=" " bindinput="changeInputValue"/>

</view>
<block wx:if="{{todos.length}}">
<view class="todo">
<view wx:for="{{todos}}" class="item" wx:key="{{index}}" bindtap="toggleTodoItem" data-index="{{index}}">
<icon class ="icon1" type="{{item.completed ? 'success':'circle'}}" />
<text class="itemName{{item.completed ? ' itemCompleted':''}}">{{item.name}}</text>
<icon class ="icon2" type="clear" catchtap="removeTodoItem" data-index="{{index}}" />
</view>
</view>

js

 let _createTodoItem = (todos,name) => {
todos.push({
name,
completed:false
});
return todos;
}
let _toggleTodoItem=(todos,index)=> {
todos[index].completed = !todos[index].completed
return todos;
}
let _removeTodoItem=(todos,index)=> {
todos.splice(index,1);
return todos;
}
let _calculateTodoCount=(todos)=> {
return todos.filter((todo)=>!todo.completed).length;
}

Page({

/**
* 页面的初始数据
*/
data: {
inputValue:'',
todoCount:3,
todos:[

]
},

/**
* 生命周期函数--监听页面加载
*/
onLoad: function (options) {

},
changeInputValue:function(e){
console.log(e.detail.value);
this.setData({
inputValue:e.detail.value
});
},

createTodoItem:function(){
this.setData({
todos: _createTodoItem(this.data.todos,this.data.inputValue),
inputValue:'',
todoCount:_calculateTodoCount(this.data.todos)
});
},

toggleTodoItem:function(e){
console.log(e.currentTarget.dataset.index);
this.setData({
todos: _toggleTodoItem(this.data.todos, e.currentTarget.dataset.index),
todoCount: _calculateTodoCount(this.data.todos)
})
},

removeTodoItem:function(e){
this.setData({
todos: _removeTodoItem(this.data.todos, e.currentTarget.dataset.index),
todoCount: _calculateTodoCount(this.data.todos)
}) 
},

})

2个回答

html5的本地存储应该可以帮到你

存数据
wx.setStorage(object) 相同key会覆盖,可写回调方法

获取方法:
wx.getStorage(object)

清除方法:
wx.clearStorage()里面可以写回调函数 成功,失败,完成

存数据 相同key会覆盖

wx.setStorageSync(key,data)

读数据

wx.getStorageSync(key) 存储是指定的key

清除数据

wx.clearStorageSync() 不可写回调方法

Csdn user default icon
上传中...
上传图片
插入图片
抄袭、复制答案,以达到刷声望分或其他目的的行为,在CSDN问答是严格禁止的,一经发现立刻封号。是时候展现真正的技术了!
立即提问