小程序实现发表评论功能


Posted in Javascript onJuly 06, 2018

本文实例为大家分享了小程序实现发表评论功能的具体代码,供大家参考,具体内容如下

小程序实现发表评论功能

1.点击发表按钮 判断内容是否为空 如果为空提示请输入内容

小程序实现发表评论功能

2.如果内容不为空 将评论框里输入的内容的值传入评论列表

<view wx:for="{{release}}" class='shoppcall comment' data-id="{{item.id }}">
      
      <button class='revoke' bindtap='binddelete' data-id='{{index}}'>撤销</button>
      
      <view class='publish'>
      <image src='https://storage.confolsc.com/storage/image/9f37e8a1fadc7ee20964dd6de7edeb4dbb4b03a1?size=130,130&t=1&redirect=1'></image>
      
      <view class='publish_list'>
       <text class='publish_list_item'>{{item.name}}</text>
       <view class='like'>
        <text class='publish_time'>{{item.time}}</text>
         <view class='like_num_list' bindtap='bindlike' data-id='{{index}}'>
          <text class='iconfont icon-dianzan2' style='{{item.likes.iszan?"color:red":"color:black"}}'></text>
          
          <text class='like_num'>{{item.likes.num}}</text>
         </view>
        
       </view>
       
       <text class='redtree_text'>{{item.textareaValue}}</text>
      </view>
      </view>
     
     
    </view>  
 
    <view wx:if='{{release.length == 0}}'>
     暂无评论
    </view>
</view>
// 点击发表评论
 formSubmit: function (e) {
  console.log('form发生了submit事件,携带数据为:', e.detail.value)
   if ( e.detail.value.input == '') {
   wx.showToast({
    title: '请输入内容',
   })
 
  } else {
   var that = this;
   var textarea_item = {};
   var textareaValue= e.detail.value.input;
   
   var release = this.data.release;
   var id = release.length 
   textarea_item.textareaValue = textareaValue;
 
    release.push(textarea_item);// 将评论内容添加到评论列表
 
 
   this.setData({
    
    release: release,
    releaseFocus: true, //隐藏输入框
    releaseValue : '' //清空输入框内容
   })
   console.log(release)
   
 
  }  
  
 },

发表完内容清空内容隐藏输入框

小程序实现发表评论功能

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
ExtJS TabPanel beforeremove beforeclose使用说明
Mar 31 Javascript
获取客户端网卡MAC地址和IP地址实现JS代码
Mar 17 Javascript
jquery validation验证身份证号,护照,电话号码,email(实例代码)
Nov 06 Javascript
JavaScript中的单引号和双引号报错的解决方法
Sep 01 Javascript
JsRender实用入门教程
Oct 31 Javascript
基于JavaScript实现购物网站商品放大镜效果
Sep 06 Javascript
Vue.js项目部署到服务器的详细步骤
Jul 17 Javascript
Vue响应式原理深入解析及注意事项
Dec 11 Javascript
微信小程序实现循环动画效果
Jul 16 Javascript
基于Vue实现平滑过渡的拖拽排序功能
Jun 12 Javascript
express如何解决ajax跨域访问session失效问题详解
Jun 20 Javascript
深入了解query和params的使用区别
Jun 24 Javascript
vue中倒计时组件的实例代码
Jul 06 #Javascript
微信小程序websocket实现聊天功能
Mar 30 #Javascript
vue中锚点的三种方法
Jul 06 #Javascript
Angularjs中date过滤器失效的问题及解决方法
Jul 06 #Javascript
详解Angular如何正确的操作DOM
Jul 06 #Javascript
微信小程序WebSocket实现聊天对话功能
Jul 06 #Javascript
JavaScript实现的简单Tab点击切换功能示例
Jul 06 #Javascript
You might like
PHP实现json_decode不转义中文的方法
2017/05/20 PHP
php多进程并发编程防止出现僵尸进程的方法分析
2020/02/28 PHP
原生js写的放大镜效果
2012/08/22 Javascript
运算符&amp;&amp;的三个不同层次
2013/04/07 Javascript
简易js代码实现计算器操作
2013/04/15 Javascript
利用js 进行输入框自动匹配字符的小例子
2013/06/29 Javascript
javascript 终止函数执行操作
2014/02/14 Javascript
[原创]jQuery常用的4种加载方式分析
2016/07/25 Javascript
Javascript日期格式化format函数的使用方法
2016/08/30 Javascript
jQuery+正则+文本框只能输入数字的实现方法
2016/10/07 Javascript
前端js实现文件的断点续传 后端PHP文件接收
2016/10/14 Javascript
jQuery联动日历的实例解析
2016/12/02 Javascript
jquery中关于bind()方法的使用技巧分享
2017/03/30 jQuery
深入理解Nodejs Global 模块
2017/06/03 NodeJs
用javascript获取任意颜色的更亮或更暗颜色值示例代码
2017/07/21 Javascript
js实现随机点名系统(实例讲解)
2017/10/18 Javascript
Bootstrap实现模态框效果
2019/09/30 Javascript
小程序分享链接onShareAppMessage的具体用法
2020/05/22 Javascript
Python ftp上传文件
2016/02/13 Python
答题辅助python代码实现
2018/01/16 Python
创建pycharm的自定义python模板方法
2018/05/23 Python
详解Python3的TFTP文件传输
2018/06/26 Python
Python机器学习之scikit-learn库中KNN算法的封装与使用方法
2018/12/14 Python
Python Numpy库datetime类型的处理详解
2019/07/13 Python
Python编程中类与类的关系详解
2019/08/08 Python
Ubuntu16安装Python3.9的实现步骤
2020/12/15 Python
HTML5梦幻之旅——炫丽的流星雨效果实现过程
2013/08/06 HTML / CSS
Html5页面获取微信公众号的openid的方法
2020/05/12 HTML / CSS
护理学毕业生自荐信
2013/10/02 职场文书
小区门卫值班制度
2014/01/24 职场文书
执行总经理岗位职责
2014/02/03 职场文书
2014年单位植树节活动方案
2014/03/23 职场文书
元宵节晚会主持词
2015/07/01 职场文书
又涨知识了,自律到底多重要?
2019/06/27 职场文书
Html5同时支持多端sdk的小技巧
2021/11/17 HTML / CSS
javascript条件式访问属性和箭头函数介绍
2021/11/17 Javascript