微信小程序——评论功能

1.前端数据渲染

<view class="list"><view>{{goodsitem.id}}</view><view>{{goodsitem.name}}</view><view>{{goodsitem.price}}</view><view>{{goodsitem.desc}}</view>
</view><view><view><input type="text" bindinput="speak"  placeholder="请输入评论内容"/></view><button bindtap="formsubmit" data-pid="{{zero}}">发布评论</button>
</view><view><text style="font-size: 26px;color: brown;">评论</text><view wx:for="{{ data }}" wx:key="index"><view>{{item.speak}}<view wx:for="{{ item.sub }}" wx:key="index" wx:for-item="itemName" style="margin: 20rpx;background-color: bisque;">{{itemName.speak}}</view></view><view><input type="text" bindinput="speak"  placeholder="请输入评论内容"/></view><button bindtap="formsubmit" data-pid="{{item.id}}">发布评论</button></view>
</view>

2.js页面

  /*** 页面的初始数据*/data: {zero:0},/*** 生命周期函数--监听页面加载*/onLoad(options) {let that = thislet id = options.idwx.request({url: 'http://www.five.com/index.php/api/goodsitem', //仅为示例，并非真实的接口地址data: {id},header: {'content-type': 'application/json' // 默认值
},success:function(res) {let data = res.data.datalet goodsitem = res.data.goodsitemthat.setData({data:data,goodsitem:goodsitem})}})},speak(c){let speak = c.detail.valuethis.setData({speak:speak})},formsubmit(c){let that = thislet speak = this.data.speaklet pid = c.currentTarget.dataset.pidwx.request({url: 'http://www.five.com/index.php/api/addSpeak', //仅为示例，并非真实的接口地址method:'post',data: {speak:speak,uid:1,wid:wid,pid:pid},header: {'content-type': 'application/json' // 默认值},success (res) {if(res.data.code == 200){let data = res.data.datalet goodsitem = res.data.goodsitemthat.setData({data:data,goodsitem:goodsitem})}}})},

3.API后台接口

    //详情信息public function goodsitem(){$id = \request()->get('id');$data = \App\Models\Goods::with(['Speak'])->where('id',$id)->first()->toArray();//调用递归方法$data =  $this->subTree($data);//查询详情数据$goodsitem = \App\Models\Goods::with(['Speak'])->where('id',$id)->first()->toArray();return json_encode(['code' => 200,'msg' => '查询成功','data' => $data,'goodsitem' => $goodsitem]);}public function addSpeak(){$data = \request()->all()//评论添加入库Speak::insert($data);//评论后重新调用详情信息$id = $data['wid'];$data = \App\Models\Goods::with(['Speak'])->where('id',$id)->first()->toArray();//调用递归方法$data =  $this->subTree($data);//查询详情数据$goodsitem = \App\Models\Goods::with(['Speak'])->where('id',$id)->first()->toArray();return json_encode(['code' => 200,'msg' => '评论成功','data' => $data,'goodsitem' => $goodsitem]);}public function subTree($data,  $pid = 0) {// 返回的结果$arr = [];foreach ($data['speak'] as $val) {// 给定的PID是当前记录的上级IDif ($pid == $val['pid']) {// 递归$val['sub'] = $this->subTree($data,$val['id']);$arr[] = $val;}}return $arr;}

4.没有样式

微信小程序——评论功能相关推荐

微信小程序评论功能实现
微信小程序开发交流qq群 173683895 承接微信小程序开发.扫码加微信. 前端 <textarea class='the_prw_in' bindinput='bindblur' ...
微信小程序评论功能实现
微信小程序开发交流qq群 581478349 微信: 承接小程序开发 wxml <textarea class='the_prw_in' bindinput='bindblur' curso ...
微信小程序评论功能的实现（用的是假数据）
具体直接看代码 wxml: <view><button bindtap='showTalks'>查看评论</button></view><!-- ...
微信小程序评论功能实现源码，复制粘贴
wxml: 发送 js: var ComContent = '' var CommentList = '[]' var app = getApp() Page({ /** * */ data: { C ...
微信小程序---评论功能实现
index.wxml: 提交评论: <view class="message"><fo ...
微信小程序-评论业务的实现
微信小程序-评论业务的实现目录微信小程序-评论业务的实现一.效果二.实现 1.wxml 2.js 3.wxss 一.效果二.实现 1.wxml <!-- wx:index = &quo ...
三步教你开通微信小程序直播功能
3月8日,微信官方举办了 "女神节"微信小程序直播的活动,联合近千品牌小程序直播首秀,当天,每个用户平均观看直播时间超过了8分钟,人均点赞数达到了280次,分享次数最高的直播间达到 ...
微信小程序支付功能-服务器端实现(附源码)
实现了小程序最新的V3版本支付功能, 包括:支付.支付通知.退款.退款通知. 服务器端使用java开发,springboot框架源码链接在评论中微信小程序支付功能-服务器端实现(附源码)_哔哩哔哩 ...
微信小程序插件功能页开发详细流程
有问题可以扫码加我微信,有偿解决问题.承接小程序开发. 微信小程序开发交流qq群 173683895 . 526474645 : 正文: 关于新出的微信小程序插件功能页做一下记录,希望能帮到大 ...

微信小程序——评论功能

微信小程序——评论功能相关推荐

最新文章

热门文章