我的远程实习笔记day10---表白墙（详情页-富文本，发送请求）-CSDN博客

本文链接：https://blog.csdn.net/wendyzhouwendy/article/details/129518109

在第二大学远程实习期间，博主分享了学习创建表白墙项目的经验，涉及使用WXML的rich-text组件展示HTML内容，并实现可复制文本的功能。此外，还展示了如何构建评论系统，包括输入框、发送按钮以及使用WXSS处理样式。通过POST请求与服务器进行数据交互，成功发送评论后，页面重定向至详情页。

摘要由CSDN通过智能技术生成

今天是在第二大学远程实习的第十天，偷偷发个博客记录一下自己的成长哈哈（今天学习表白墙项目）
wxml

 <!-- 介绍 rich-text为富文本标签,可以将部分HTM内容进行转码到小程序中显示,user-select设置成true是让文本可以被复制.具体效果参考:https://developers.weixin.qq.com/miniprogram/dev/component/rich-text.html  -->
  <rich-text nodes="{{neirong}}" class="Zhengwen" user-select="true"></rich-text>
  <view class="pinglunquanniu">
    <form bindsubmit="formpinglun">
      <view class="pinglunfasong">
        <input name="pinglun" placeholder="添加评论"/><button form-type="submit" data-id="{{id}}">发送</button>
      </view>
    </form>
  </view>
  <view>
  <text>\n\n评论：</text>
  <view wx:for="{{pinglun}}" class="pinglunliebiao">
    <view>{{item.username}}：{{item.title}}</view>
  </view>
  <text>\n\n</text>
  </view>
</view>

wxss:

formpinglun:function(e){
  var that=this
  var id=this.data.neirongid;
  console.log("点击了发送",e),
  wx.request({
    url: 'https://xx.uom.cn/ecmsapi/index.php?mod=xinxi&act=pinglunshangchuan',
    method:'POST',
    data:{
      scpinglun:e.detail.value.pinglun,
      scneirongid:id,
    },
    header: {
      'content-type': 'application/x-www-form-urlencoded'
    },
    success (res) {
      console.log("返回的数据",res.data);
      var tishi = res.data.message;
      wx.redirectTo({
        url: '/pages/xiangqing/xiangqing?id='+id,
      })
    }