微信小程序视频下页面评论代码

以下是微信小程序视频下页面评论的代码示例：

1. 首先在 wxml 文件中添加评论框和评论列表：

<view class="comment-wrapper">
  <textarea class="comment-input" placeholder="请输入评论" bindinput="onInput"></textarea>
  <button class="comment-btn" bindtap="onSubmit">评论</button>
</view>
<view class="comment-list">
  <block wx:for="{{comments}}" wx:key="index">
    <view class="comment-item">{{item.content}}</view>
  </block>
</view>

2. 在 js 文件中，定义数据和事件处理函数：

Page({
  data: {
    comments: [], // 评论列表
    inputValue: '' // 输入框的值
  },
  onInput(e) {
    this.setData({
      inputValue: e.detail.value
    })
  },
  onSubmit() {
    const content = this.data.inputValue.trim()
    if (!content) {
      return
    }
    const comment = {
      content: content
    }
    const comments = [comment, ...this.data.comments]
    this.setData({
      comments: comments,
      inputValue: ''
    })
  }
})

3. 在样式文件中添加样式：

.comment-wrapper {
  display: flex;
  flex-direction: row;
  align-items: center;
  margin: 20rpx;
}

.comment-input {
  flex: 1;
  height: 80rpx;
  padding: 20rpx;
  border: 1rpx solid #ccc;
  border-radius: 10rpx;
}

.comment-btn {
  width: 100rpx;
  height: 80rpx;
  margin-left: 20rpx;
  background-color: #007aff;
  color: #fff;
  border-radius: 10rpx;
  text-align: center;
  line-height: 80rpx;
}

.comment-list {
  margin: 20rpx;
}

.comment-item {
  padding: 10rpx;
  border: 1rpx solid #ccc;
  border-radius: 10rpx;
  margin-bottom: 10rpx;
}

以上就是微信小程序视频下页面评论的代码示例。