微信小程序收藏功能,出去后进来图标会自动重置,但数值正常,无报错

var postsData = require('../../../data/posts-data.js')

var app = getApp();

Page({

data: {

//isPlayingMusic: flase

},

onLoad: function(option) {

var postId = option.id;

//url: "post-detail/post-detail?id=" + postId;?后面的id=option.id里的id

this.data.currentPostId = postId;

var postData = postsData.postList[postId];

// this.setData({

//postData: postData

//})

this.postData = postsData.postList[postId]

var postsCollected = wx.getStorageSync('posts_collected')

if (postsCollected) {

var postCollected = postsCollected[postId]

this.setData({

postData: postData//将data上的数据传送到页面

})

}

else {

var postsCollected = {};

postsCollected[postId] = false;

wx.setStorageSync('posts_collected', postsCollected);

}

if (app.globalData.g_isPlayingMusic && app.globalData.g_currentMusicPostId === postId) {

this.setData({

isplayingMusic:true

})

}

this.setMusicMonitor();

},

setMusicMonitor: function() {

//点击播放图标和总控开关都会触发这个函数

var that = this;

wx.onBackgroundAudioPlay(function(event) {

var pages = getCurrentPages();

var currentPage = pages[pages.length - 1];

if (currentPage.data.currentPostId === that.data.currentPostId) {

// 打开多个post-detail页面后,每个页面不会关闭,只会隐藏。通过页面栈拿到到

// 当前页面的postid,只处理当前页面的音乐播放。

if (app.globalData.g_currentMusicPostId == that.data.currentPostId) {

// 播放当前页面音乐才改变图标

that.setData({

isPlayingMusic: true

})

}

// if(app.globalData.g_currentMusicPostId == that.data.currentPostId )

// app.globalData.g_currentMusicPostId = that.data.currentPostId;

}

app.globalData.g_isPlayingMusic = true;

});

wx.onBackgroundAudioPause(function() {

var pages = getCurrentPages();

var currentPage = pages[pages.length - 1];

if (currentPage.data.currentPostId === that.data.currentPostId) {

if (app.globalData.g_currentMusicPostId == that.data.currentPostId) {

that.setData({

isPlayingMusic: false

})

}

}

app.globalData.g_isPlayingMusic = false;

// app.globalData.g_currentMusicPostId = null;

});

wx.onBackgroundAudioStop(function() {

that.setData({

isPlayingMusic: false

})

app.globalData.g_isPlayingMusic = false;

//app.globalData.g_currentMusicPostId = null;

});

},

onCollectionTap: function(event) {

this.getPostsCollectedAsy();

},

getPostsCollectedAsy: function() {

var that = this;

wx.getStorage({

key: "posts_collected",

success: function(res) {

var postsCollected = res.data;

var postCollected = postsCollected[that.data.currentPostId];

// 收藏变成未收藏,未收藏变成收藏

postCollected = !postCollected;

postsCollected[that.data.currentPostId] = postCollected;

that.showToast(postsCollected, postCollected);

}

})

},

getPostsCollectedSyc: function() {

var postsCollected = wx.getStorageSync('posts_collected');

var postCollected = postsCollected[this.data.currentPostId];

// 收藏变成未收藏,未收藏变成收藏

postCollected = !postCollected;

postsCollected[this.data.currentPostId] = postCollected;

this.showToast(postsCollected, postCollected);

},

showModal: function(postsCollected, postCollected) {

var that = this;

wx.showModal({

title: "收藏",

content: postCollected ? "收藏该文章?" : "取消收藏该文章?",

showCancel: "true",

cancelText: "取消",

cancelColor: "#333",

confirmText: "确认",

confirmColor: "#405f80",

success: function(res) {

if (res.confirm) {

wx.setStorageSync('posts_collected', postsCollected);

// 更新数据绑定变量,从而实现切换图片

that.setData({

collected: postCollected

})

}

}

})

},

showToast: function(postsCollected, postCollected) {

// 更新文章是否的缓存值

wx.setStorageSync('posts_collected', postsCollected);

// 更新数据绑定变量,从而实现切换图片

this.setData({

collected: postCollected

})

wx.showToast({

title: postCollected ? "收藏成功" : "取消成功",

duration: 1000,

icon: "success"

})

},

onShareTap: function(event) {

var itemList = [

"分享给微信好友",

"分享到朋友圈",

"分享到QQ",

"分享到微博"

];

wx.showActionSheet({

itemList: itemList,

itemColor: "#405f80",

success: function(res) {

// res.cancel 用户是不是点击了取消按钮

// res.tapIndex 数组元素的序号,从0开始

wx.showModal({

title: "用户 " + itemList[res.tapIndex],

content: "用户是否取消?" + res.cancel + "现在无法实现分享功能,什么时候能支持呢"

})

}

})

},


onMusicTap: function(event) {

var currentPostId = this.data.currentPostId;

var postData = postsData.postList[currentPostId];

var isPlayingMusic = this.data.isPlayingMusic;

if (isPlayingMusic) {

wx.pauseBackgroundAudio();

this.setData({

isPlayingMusic: false

})

// app.globalData.g_currentMusicPostId = null;

app.globalData.g_isPlayingMusic = false;

} else {

wx.playBackgroundAudio({

dataUrl: postData.music.url,

title: postData.music.title,

coverImgUrl: postData.music.coverImg,

})

this.setData({

isPlayingMusic: true

})

app.globalData.g_currentMusicPostId = this.data.currentPostId;

app.globalData.g_isPlayingMusic = true;

}

}

})

上面的这是post-detail.js里的代码。

<!--pages/posts/post-detail/post-detail.wxml-->

<view class="container">

<image class="head-image" src="{{isPlayingMusic?postData.music.coverImg:postData.headImgSrc}}"></image>

<image catchtap="onMusicTap" class="audio"

src="{{isPlayingMusic?'/images/music/music-stop.png': '/images/music/music-start.png'}}"></image>

<view class="author-date">

<image class="avatar" src="{{postData.avatar}}"></image>

<text class="author">{{postData.author}}</text>

<text class="const-text">发表于</text>

<text class="date">{{postData.dateTime}}</text>

</view>

<text class="title">{{postData.title}}</text>

<view class="tool">

<view class="circle-img">

<image wx:if="{{collected}}" catchtap="onCollectionTap"

src="/images/icon/collection.png"></image>

<image wx:else catchtap="onCollectionTap"

src="/images/icon/collection-anti.png"></image>

<image catchtap="onShareTap" class="share-img"

src="/images/icon/share.png"></image>

</view>

<view class="horizon"></view>

</view>

<text class="detail">{{postData.detail}}</text>

</view>

上面的这是post-detail.wxml里的代码。

麻烦各位大神了,微信小程序收藏功能,收藏然后出去后进来图标会自动重置,但数值正常,无报错。

夜阑卧听风吹雨y
浏览 1860回答 2
2回答
打开App,查看更多内容
随时随地看视频慕课网APP