最近要写一个h5端的评论功能,记录在此:
1.首先是评论的主体部分
<template>
<div v-if="!preview" class="medical_comment">
<div class="medical_comment_top">
<div class="medical_comment_top_all">全部评论(<span class="comment_count">{
{ commentCount }}</span>)</div>
<ul class="comment_list">
<van-list // 这是vant组件库的瀑布流加载
v-model="loading"
:finished="finished"
:finished-text="commentList.length ? '没有更多了' : '暂无评论'"
:immediate-check="false"
@load="loadMore"
>
<div class="medical_head_comment_item_wrapper">
<medical-head-comment-item // 这是展示评论的地方,单独写了个组件
v-for="(item, index) of commentList"
:key="'comment_item' + index"
:comment="item"
@reply="handleReply"
></medical-head-comment-item>
</div>
</van-list>
</ul>
<div v-if="replyInputVisable" class="reply_wrapper">
<div class="input_wrapper">
<input // 这是点击每条评论后