小程序实现发表评论功能

2024-11-30 17:20:50

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

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)

  }  

 },

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

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持我们。

微信小程序仿知乎实现评论留言功能

最近沉迷学习无法自拔,太久没有码字,码一个小程序留言功能实现.先上一波最后效果图: (删除按钮,是用户自己的留言时才会显示该按钮) 实现技术后台:SSM框架数据库:MySQL数据库数据库设计评论功能的实现主要涉及三个表 comment:存储留言评论信息,表结构如下: 表中,必须的字段:id,user_id,reply_comment_id,comment,insert_time,source_id 添加了冗余字段username,reply_user_name,userphoto 主要用
微信小程序实现评论功能

本文实例为大家分享了微信小程序实现评论功能的具体代码,供大家参考,具体内容如下前端 <textarea class='the_prw_in' bindinput='bindblur' cursor-spacing="130" placeholder='说点什么吧...' maxlength="76"> </textarea> <view class='the_prw_btn' bindtap='btn_send'> 留言 <
微信小程序实现简单评论功能

本文实例为大家分享了微信小程序实现评论功能的具体代码,供大家参考,具体内容如下具体直接看代码 wxml: <view> <button bindtap='showTalks'>查看评论</button> </view>  <view class='talks-layer' animation='{{talksAnimationData}}'>  &l
小程序实现发表评论功能

本文实例为大家分享了小程序实现发表评论功能的具体代码,供大家参考,具体内容如下 1.点击发表按钮判断内容是否为空如果为空提示请输入内容 2.如果内容不为空将评论框里输入的内容的值传入评论列表 <view wx:for="{{release}}" class='shoppcall comment' data-id="{{item.id }}"> <button class='revoke' bindtap='binddelete' data-i
微信小程序实现发动态功能的示例代码

目录一.设计所需要的表 1.文章表 2.评论表 3.点赞表二.发布动态 1.文本区 2.最终发表动态效果 3.发布动态代码最近做了一个校园拍卖小程序,想在里面添加一个类似校园圈功能,现在来一步一步实现. 一.设计所需要的表 1.文章表文章表很简单,就类似朋友圈,一个文字内容,一个图片数组 2.评论表 3.点赞表二.发布动态 1.文本区光标有点问题,回车换行时光标和文字被埋在下面了解决,给textarea设置一个最大高度,max-length,把scroll-view改为view ,
微信小程序纯文本实现@功能

前言大家肯定对@功能不陌生,在如今的各大社交软件中它是一种不可或缺的功能.实现@人的功能并不复杂,只需将@人员的id传给后端,后端下发通知即可.主要的复杂点在于一键删除功能与变色功能,web端可以使用现成库 caret.js 或者 At.js 来实现.但笔者需要在小程序中实现这个功能,而且在 textarea 标签里实现,当然@人名的变色功能自然而然就砍掉了. 准备工作怎么来实现一键删除呢?首先想到对@人名前后用特殊符号标记+正则来实现,但结果不是很理想,扩展性也比较差,如果还要匹配话题之类
微信小程序登录与注册功能的实现详解

目录小程序中的登录用户注册用户信息修改总结小程序中的登录在小程序中有一个概念叫openid,这个相当于登录小程序用户的唯一标识,每个微信用户都不同.那要如何拿到用户的唯一标识呢?在微搭低代码中是通过调用系统的api来获取的 let userinfo = await app.utils.getWXContext() 我们通过这行代码的调用来获取到用户的唯一标识,获取到之后我们其他页面也需要使用,那就需要把他存起来.全局变量的作用域是所有页面都可见,所以我们需要在变量中定义一个全局变量叫
C#开发之微信小程序发送模板消息功能

步骤一:获取模板ID 有两个方法可以获取模版ID 通过模版消息管理接口获取模版ID 在微信公众平台手动配置获取模版ID 步骤二:页面的 <form/> 组件,属性report-submit为true时,可以声明为需发模板消息,此时点击按钮提交表单可以获取formId,用于发送模板消息.或者当用户完成支付行为,可以获取prepay_id用于发送模板消息. 步骤三:调用接口下发模板消息今天重要的说第三步怎么实现,前面的步骤比较简单就略过. ----------------------------
微信小程序页面跳转功能之从列表的item项跳转到下一个页面的方法

本文实例讲述了微信小程序页面跳转功能之从列表的item项跳转到下一个页面的方法.分享给大家供大家参考,具体如下: 很多项目都会有消息记录页,即列表页,紧接着就是点击列表的某一项进入到消息的详情页,这里承接上一篇文章,继续分享如何从列表的item项跳转到下一个页面. 一.效果图从左边的列表页调到右边的详情页二.页面之间的跳转首先要看的是页面的跳转,微信小程序有三种跳转方式可供选择: 1.保留当前页面,跳转到应用内的某个页面,使用wx.navigateBack可以返回到原页面. wx.navi
微信小程序实现的涂鸦功能示例【附源码下载】

本文实例讲述了微信小程序实现的涂鸦功能.分享给大家供大家参考,具体如下: 先来看看运行效果: 布局文件index.wxml: <view class="container">  <view class="canvas_area">  &
微信小程序自动客服功能

微信小程序最近比较火爆,所以抽空做了个客服机器人的小程序,来回答之前坦克游戏中的常见问题.当然这个小程序也很容易修改为其他类型的自动客服,需要做的仅仅是在olami平台加上相应的问题和答案. 整个小程序界面包含2个部分,一部分用于显示回答,一部分为输入框.小程序的核心就是向olami服务器发送http请求,然后处理结果并显示出来.olami接口的详细使用方法可以参考置顶的两篇博客.处理输入的代码如下: bindInput: function (e) { var that = this; var
使用Python制作简单的小程序IP查看器功能

前言说实话,查看电脑的IP,也挺无聊的,但是够简单,所以就从这里开始吧.IP地址在操作系统里就可以直接查看.但是除了IP地址,我们也想通过IP获取地理地址和网络运营商情况.IP地址和地理地址并没有固定的关系,所以我们需要借助网络上的数据库,或者说借助第三方的服务来查询.这里,我们选用IP.CN提供的IP地址查询服务. 基本环境配置版本:Python3 系统:Windows 相关模块:PyQt5 实现效果图完整代码运行以上程序,点击按钮,大约卡顿半秒后,文本标签处就会显示我们电脑的IP地址

小程序实现发表评论功能

相关推荐

随机推荐