~~~ 1. 设置data中的状态 2. 在setData中设id <image src="{{shared?'/images/icon/share.png':'/images/icon/share-anti.png'}}" class="avatar" catchtap="onShare"></image> <image src="{{collected?'/images/icon/collection.png':'/images/icon/collection-anti.png'}}" class="avatar" catchtap="onCollect"></image> ~~~ ~~~ const local = require("../../../data/local"); const audio = wx.getBackgroundAudioManager(); Page({ /** * 页面的初始数据 */ data: { // 音乐的播放状态 isPlay: false, collected:false, shared:false }, /** * 生命周期函数--监听页面加载 */ onLoad: function (options) { var self = this; var id = options.id; var data = local.postList[options.id]; this.setData({ data, postId: id, music: local.postList[options.id].music }); /* 音乐暂停监听 */ audio.onPause(()=>{ self.setData({ isPlay:false }) }) /* 音乐播放监听 */ audio.onPlay(()=>{ self.setData({ isPlay:true }) }) /* 1.有缓存则取值,没有缓存则创建缓存 */ let allCollected = wx.getStorageSync('allCollected'); if(allCollected){ let storageCollected = allCollected[id]; this.setData({ collected:storageCollected }) }else{ let allCollected = { }; allCollected[id]=false; wx.setStorageSync('allCollected', allCollected); } }, playMusic() { var self = this; var url = this.data.music.url; if(this.data.isPlay){ audio.pause(); this.setData({ isPlay:false }) }else{ audio.src = url; this.setData({ isPlay:true }) } }, onCollect(){ /* 2.更新缓存 */ var allCollected = wx.getStorageSync('allCollected'); var storageCollected = allCollected[this.data.postId]; storageCollected = !storageCollected; allCollected[this.data.postId] = storageCollected; wx.setStorageSync("allCollected", allCollected); /* 3.更新收藏的状态 */ this.setData({ collected:storageCollected }) }, onShare(){ wx.showActionSheet({ itemList: ["分享到微信","分享到微博","分享到朋友圈"], itemColor: '#ff2d51', success:res=>{ console.log(res.tapIndex); this.setData({ shared:true }) }, fail:err=>{ this.setData({ shared:false }) } }) } }) ~~~