小程序实现发表评论功能


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 相关文章推荐
用javascript getComputedStyle获取和设置style的原理
Oct 10 Javascript
详解JS 比较两个Json对象的值是否相等的实例
Nov 20 Javascript
使用javascript实现有效时间的控制,并显示将要过期的时间
Jan 02 Javascript
javascript实现十秒钟后注册按钮可点击的方法
May 13 Javascript
jQuery垂直多级导航菜单代码分享
Aug 18 Javascript
Javascript实现跑马灯效果的简单实例
May 31 Javascript
jQuery实现的可编辑表格完整实例
Jun 20 Javascript
详细讲解JavaScript中的this绑定
Oct 10 Javascript
php register_shutdown_function函数详解
Jul 23 Javascript
你应该了解的JavaScript Array.map()五种用途小结
Nov 14 Javascript
SSM+layUI 根据登录信息显示不同的页面方法
Sep 20 Javascript
解决vue项目中页面调用数据 在数据加载完毕之前出现undefined问题
Nov 14 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 class类的用法详细总结
2013/10/17 PHP
PHP实现定时执行任务的方法
2014/10/05 PHP
PHP+MYSQL中文乱码问题
2015/07/01 PHP
php字符串比较函数用法小结(strcmp,strcasecmp,strnatcmp及strnatcasecmp)
2016/07/18 PHP
Yii2.0建立公共方法简单示例
2019/01/29 PHP
详解Laravel服务容器的绑定与解析
2019/11/05 PHP
Javascript Function对象扩展之延时执行函数
2010/07/06 Javascript
使用Jquery获取带特殊符号的ID 标签的方法
2014/04/30 Javascript
jQuery实现仿腾讯视频列表分页效果的方法
2015/08/07 Javascript
js实现温度计时间样式代码分享
2015/08/21 Javascript
js文本框输入内容智能提示效果
2015/12/02 Javascript
JavaScript优化专题之Loading and Execution加载和运行
2016/01/20 Javascript
Javascript实现鼠标框选操作  不是点击选取
2016/04/14 Javascript
移动端js图片查看器
2016/11/17 Javascript
通过BootStrap-select插件 js jQuery控制select属性变化
2017/01/03 Javascript
详解数组Array.sort()排序的方法
2020/05/09 Javascript
Vue.js 2.0学习教程之从基础到组件详解
2017/04/24 Javascript
jQuery查找和过滤_动力节点节点Java学院整理
2017/07/04 jQuery
解决layer 关闭当前弹窗 关闭遮罩层 input值获取不到的问题
2019/09/25 Javascript
Python中捕捉详细异常信息的代码示例
2014/09/18 Python
Python制作简单的网页爬虫
2015/11/22 Python
用pickle存储Python的原生对象方法
2017/04/28 Python
python jieba分词并统计词频后输出结果到Excel和txt文档方法
2018/02/11 Python
python使用itchat实现手机控制电脑
2018/02/22 Python
Python延时操作实现方法示例
2018/08/14 Python
Windows下Pycharm远程连接虚拟机中Centos下的Python环境(图文教程详解)
2020/03/19 Python
荷兰演唱会和体育比赛订票网站:viagogo荷兰
2018/04/08 全球购物
交通安全演讲稿
2014/01/07 职场文书
巴西世界杯32强口号
2014/06/05 职场文书
节约能源标语
2014/06/17 职场文书
学习保证书
2015/01/17 职场文书
户外拓展训练感想
2015/08/07 职场文书
《桂花雨》教学反思
2016/02/19 职场文书
调研报告的主要写法
2019/04/18 职场文书
创业者如何撰写出一份打动投资人的商业计划书?
2019/07/02 职场文书
vscode远程免密登入Linux服务器的配置方法
2022/06/28 Servers