在实现新闻小程序的文章收藏功能时,第一次点击新闻详情时控制台正常输出,但是当我第再次点击查看其他文章详情的时候,控制台会抛出错误:Setting data field "collected" to undefined is invalid.
经过一下午的时间,终于解决了这个错误。
出现这个错误的原因是在页面加载时会从缓存里获取文章的收藏状态,只有点进文章详情时,才会将该文章的收藏状态存到缓存里。没有点进过的文章的收藏状态是为空的。在小程序里,数据如果为空,会将其转为undefined。所以系统会抛出这个错误。
解决方法:进行setDate操作之前对postCollected进行判断,判断其是否为空。如果为空则将collected设为false,收藏按钮将会显示灰色的图片。
var postsCollected = wx.getStorageSync("posts_collected");
// ----问题所在位置----
if(postsCollected){ //postsCollected为真的情况,在缓存中存在
// debugger;
var postCollected = postsCollected[postId]; // 读取其中一个缓存状态
// this.setData.postsCollected = postsCollected;
// 需要对获取到的状态做判断,如果没有点击过收藏按钮的文章,缓存中是没有这个数据的,所有会提示collected undefined
if(!postCollected){
this.setData({
collected: false
})
}else{
this.setData({
collected: postCollected
})
}