微信小程序文章点赞功能

小程序给文章点赞

资讯列表页

详情页

小程序前端代码：

(在前端添加点击事件 bindtap='update')

<view style='padding-top:30rpx;width:93%;margin:0 auto;'><text class='block font15 gray5 tl fl' style='padding-left:20rpx;'>阅读数  {{oldcommon.read_num}} </text><view class='p_tb15 m_t5 fr' style='width:15%;margin-top:-30rpx;margin-right:10rpx;'  bindtap='update_zan'><view  wx:if="{{oldcommon.zanstate == 0}}"><image  class='fl zanimagerrzy' src='/images/zan.png' style='width:32rpx;height:32rpx;margin-top:3rpx;'></image></view><view  wx:elif="{{oldcommon.zanstate == 1}}"><image src='/images/zanclock.png' class='fl zanimagerrzy' style='width:32rpx;height:32rpx;margin-top:3rpx;'></image></view><text class='fl m_lr5 font15 gray5 zanallrrzy'>{{oldcommon.vote_num}}</text><view class='cl'></view></view><view class='cl'></view>
</view>

小程序点击事件JS代码

 //点赞 update_zanupdate_zan: function (e) {var that = this;var oldcommon = that.data.oldcommon;console.log(oldcommon);var zanstate = (oldcommon.zanstate == 1) ? 0 : 1;var zanall = oldcommon.vote_num;// 更换状态并修改数据库wx.request({url: app.d.hostUrl + 'changezanstate',data: {id: oldcommon.id,openid: wx.getStorageSync('openid'),zanstate: zanstate},method: 'GET',// header: {},   success: function (res) {//console.log(res);var data = res.data;if(data.errno == 1){// 执行失败则提示并终止程序return;}// 成功则刷新摸板// 更新图片和更新点赞总数var imgsrc = "";if (zanstate == 1){oldcommon.vote_num++;} else{oldcommon.vote_num--;}oldcommon.zanstate = zanstate;//console.log(oldcommon);that.setData({id: oldcommon.id,oldcommon: oldcommon})       }})return ;},

后台接口php

//切换文章点赞状态public function doPagechangezanstate(){global $_W,$_GPC;$uniacid=$_W['uniacid'];// 接收参数$id=$_GPC['id'];$openid=$_GPC['openid'];$zanstate = $_GPC['zanstate'];// 检测文章是否存在$common = pdo_fetch("select * from ".tablename('yyf_company_news')." where id='$id'");if (!$common) {//文章不存在退出return $this->result(1,'error','未找到该文章');}// 检测用户是否存在$userinfo = pdo_fetch("select * from ".tablename('yyf_company_userinfo')." where openid='$openid'");if (!$userinfo) {//用户不存在退出return $this->result(1,'error','未找到该用户');}// 开启事务，因为使用mysiam表，这里暂不使用事务// 验证并更新点赞中间表（备注：中间表执行失败继续执行，不影响总数，若要严谨则表修改成innodb引擎并使用事务）$zan = pdo_fetch("select * from ".tablename('yyf_company_zan')." where `a_id` = $id and `openid`='$openid'");if ($zan) {// 不能重复操作if ((int)$zan['status'] == $zanstate) {// 取消点赞则退出if ($zanstate == 0) {return $this->result(1,'error','未点赞不能取消');}// 重复操作退出return $this->result(1,'error','不能重复点赞');}// 更新中间表状态pdo_update('yyf_company_zan', array('status =' => $zanstate),array('a_id' => $id, 'openid' => $openid));}else{// 取消点赞则退出if ($zanstate == 0) {return $this->result(1,'error','未点赞不能取消');}// 插入中间表pdo_insert("yyf_company_zan", array('openid' => $openid, 'a_id' => $id, 'create_at' => time()));}$num = ($zanstate == 1) ? 1 : -1;// 增减点赞总数$res = pdo_update('yyf_company_news', array('vote_num +=' => $num),array('id' => $id));if (!$res) {// 数据库执行失败则退出return $this->result(1,'error',"数据库执行失败");}// 成功则提交事务并更新摸板，反之则提示失败不更新摸板// 成功返回，并刷新摸板// 这里为了执行效率并且对于点赞总数严谨性不高，不从数据库取数据，直接前端更新return $this->result(0,'success',$data);}

对应的数据表

微信小程序文章点赞功能相关推荐

微信小程序列表点赞功能
实现思路: 1.找到对应文章的id 2.前端利用缓存wx.setStorageSync或者在页面js中this.setData()保存列表中点赞的id 3.点赞和取消点赞对应点赞数改变 4.后台的数据 ...
微信小程序实现点赞功能（前端）
可以通过以下代码实现点赞效果,且只能点赞一次: <view class="card-right"><text class="topText"& ...
微信小程序原生开发功能合集一：微信小程序开发介绍
一.专栏介绍本专栏主要内容为微信小程序常用功能开发过程的介绍说明,包括开发微信小程序常用组件的封装.常用功能的开发等,提供源代码.开发过程讲解视频.完整的课程等. 组件封装: 下拉选择组件. ...
IVX低代码平台开发——微信小程序实现抽奖功能
写在前面通过利用可视化编程实现微信小程序的抽奖功能,带大家初步了解 iVX 的强大之处. 文章目录写在前面 iVX开发抽奖功能实现 iVX开发基本介绍 iVX是一个 "零代码&quo ...
python玩微信小程序游戏_使用python实现微信小程序自动签到功能
功能描述目标完成多账号微信小程序每天自动签到输出签到成功则向微信群发送签到成功的信息否则提示用户签到失败,需手动签到包管理 requests itchat time threading 程序 ...
微信小程序支付退款功能
微信小程序支付退款功能 2022年02月做了一个微信小程序前端+ASP.NET后台的微信退款功能.功能的基本原理是使用JSAPI方式,对接之前的微信支付功能差不多.也是要签名,校验等.只不过它的退款传 ...
小程序录音上传服务器,微信小程序录音实现功能并上传(使用node解析接收)
微信小程序录音实现功能并上传(使用node解析接收) 发布时间:2020-09-04 11:59:06 来源:脚本之家阅读:97 作者:weixin_43188227 背景我在开发小程序的时候,有 ...
微信小程序实现点赞气泡效果
微信小程序实现点赞气泡效果先上代码: <view class="listImg"><block wx:for="{{8}}" wx:key= ...
android指南针小程序,使用微信小程序实现指南针功能
使用微信小程序实现指南针功能发布时间:2020-10-26 15:18:16 来源:亿速云阅读:79 作者:Leah 本篇文章为大家展示了使用微信小程序实现指南针功能,内容简明扼要并且容易理解,绝 ...

微信小程序文章点赞功能

微信小程序文章点赞功能相关推荐

最新文章

热门文章

微信小程序 文章点赞功能

微信小程序 文章点赞功能相关推荐

最新文章

热门文章

微信小程序文章点赞功能

微信小程序文章点赞功能相关推荐