显示点赞方法，如果用户点过赞，则不做任何处理，如果没有则把openid作为唯一标识传递后服务端。
zan() {
//如果已经点过赞，则跳出
if (this.data.zanclass === 'icon-dianzan') {
return false
} else {
http({
data: {
useremail: `${getApp().globalData.openid}@xcx.com`,
article: this.data.articleModel._id
},
method: 'post',
url: '/zan'
}).then((res) => {
//给出一个小震动
wx.vibrateShort({
type: 'light'
})
this.haszan()
}).catch(() => {
wx.showToast({
title: '发生错误!',
icon: 'error',
duration: 1000
})
})
}当点击评论按钮时，先判断用户是否已经授权用户名，如果没有则弹出授权框。
showDialog() {
if (!this.data.userInfo) {
this.getUserProfile().then(() => {
this.handelShowDialog()
})
} else {
this.handelShowDialog()
}
},定义getUserProfile方法，获取用户授权，这里进行了一层promise包装，当上层调用时，可以实现同步。
getUserProfile() {
return new Promise((resolve, reject) => {
wx.getUserProfile({
desc: '用于完善会员资料',
success: (res) => {
wx.setStorageSync('SHUserInfo', res.userInfo)
this.setData({
userInfo: res.userInfo
})
resolve()
},
fail: () => {
reject()
}
})
})
},评论模块，我用的是比较简单的系统自带的模态框，自己写一个更友好界面的模态框比较复杂，暂时先凑合着用吧。
// 执行展开对话框事件
handelShowDialog() {
wx.showModal({
editable: true,
placeholderText: '请理性留言',
confirmText: '提交',
success: (res) => {
if (res.confirm) {
let content = res.content
if (content.length === 0) {
wx.showToast({
title: '您啥都没有说',
icon: 'error',
duration: 1000
})
} else {
let replyModel = {
content,
from: this.data.userInfo.nickName,
article: this.data.articleModel._id,
to: ''
}
http({
data: replyModel,
method: 'post',
url: '/reply'
}).then((res) => {
wx.showToast({
title: '已提交等待审核',
icon: 'success',
duration: 1800,
mask: true
})
}).catch(() => {
wx.showToast({
title: '发生错误!',
icon: 'error',
duration: 1000
})
})
}
} else if (res.cancel) {
return false
}
}
})最后，收藏的话，其实服务端也可以做一套收藏接口，不过留到以后吧，暂时先不添加实际功能了，提示用户自己收藏到微信即可。
shoucang() {
wx.showToast({
title: '点击右上后收藏!',
icon: 'success',
duration: 2000
})
},好了，至此详情页全部完成了，接下去就是菜单底部的博客页面了。