<image wx:if="{{collected}}" catchtap='onCollectionTap' src='/images/icon/collection.png'></image>   <image wx:else src='/images/icon/collection-anti.png' catchtap='onCollectionTap'></image>

// pages/post_detail/post_detail.jsvar postData = require("../../data/posts_data.js")Page({ /**  * 頁面的初始數據  */ data: { }, /**  * 生命周期函數--監聽頁面加載  */ onLoad: function(options) {  var postId = options.id;  this.data.currentPostId = postId  var postsData = postData.postList[postId];  console.log(postsData);  // this.data.postData=postsData;  this.setData({   post_key: postsData  })  // var postsCollected={  //  1:"true",  //  2:"false",  //  3:"true",  // }  // console.log(postData);  // 從緩存中讀取所有的緩存狀態  var postsCollected = wx.getStorageSync("posts_Collected")  //如果緩存為真，執行以下代碼  if (postsCollected) {   //讀取其中一個緩存狀態   var postsCollected = postsCollected[postId]   this.setData({    //將是否被收藏的狀態上綁定到collected這個變量上    collected: postsCollected   })  } else {   var postsCollected = {};   postsCollected[postId] = false;   wx.setStorageSync("posts_Collected", postsCollected)  } }, onCollectionTap: function(event) {  //獲取緩存的方法  var postsCollected = wx.getStorageSync('posts_Collected');  var postCollected = postsCollected[this.data.currentPostId];  console.log(postCollected);  //取反操作，收藏的話，點擊變成未收藏，反之，變成收藏。  postCollected = !postCollected;  postsCollected[this.data.currentPostId] = postCollected;  // //更新文章是否收藏的緩存值。  // wx.setStorageSync('posts_Collected', postsCollected)  // //更新數據綁定變量,從而實現切換圖片。  // this.setData({  //  collected: postCollected  // })  this.showModal(postsCollected, postCollected)  // wx.showToast({  //  title: postCollected ? "收藏成功" : "取消收藏",  //  duration: 800,  //  icon: "success"  // })  // wx.showModal({  //  title: '確定收藏',  //  content: '這是一個模態彈窗',  //  success: function (res) {  //   if (res.confirm) {  //    console.log('用戶點擊確定')  //   } else if (res.cancel) {  //    console.log('用戶點擊取消')  //   }  //  }  // })  console.log("onCollectionTap"); },//使用showModal API來實現界面上邏輯操作。 showModal: function(postsCollected, postCollected) {//這個注意一下，由于this是在page下調用的方法，這里是在自定義函數下，所有必須重新賦值到一個新的變量，才能重新使用，不明白的同學們，記住就行。  var ts = this;  wx.showModal({   title: '收藏',   content: postCollected ? "收藏該文章" : "取消收藏該文章",   success: function(res) {    if (res.confirm) {     wx.setStorageSync('posts_Collected', postsCollected)     //更新數據綁定變量,從而實現切換圖片。     ts.setData({      collected: postCollected     })     console.log('用戶點擊確定')    } else if (res.cancel) {     console.log('用戶點擊取消')    }   }  }) }, // onCollectionTap: function(event) { //  var baoxue = wx.getStorageSync("key"); //  console.log(baoxue); // }, onShareTap: function(event) {  // wx.removeStorageSync("key")  //緩存的上限最大不能超過10MB  wx.clearStorageSync();  console.log("onShareTap"); }, /**  * 生命周期函數--監聽頁面初次渲染完成  */ onReady: function() { }, /**  * 生命周期函數--監聽頁面顯示  */ onShow: function() { }, /**  * 生命周期函數--監聽頁面隱藏  */ onHide: function() { }, /**  * 生命周期函數--監聽頁面卸載  */ onUnload: function() { }, /**  * 頁面相關事件處理函數--監聽用戶下拉動作  */ onPullDownRefresh: function() { }, /**  * 頁面上拉觸底事件的處理函數  */ onReachBottom: function() {  console.log("到底了"); }, /**  * 用戶點擊右上角分享  */ onShareAppMessage: function() { }})