组件截图

个人博客地址

个人技术博客

线上演示

开源

github开源地址

配套后端github开源地址

Install

npm i message-comment

view

<template>
  <div id="app">
    <comment
      :load="load" // 一级页面加载更多
      :Loading="Loading" // 二级页面加载
      :msgData="msgData" // 一级页面数据
      :DetailsData="DetailsData" //二级页面数据
      :sortFun="sortFun" // 排序事件
      :total="total" // 总评论（包括子评论）
      :floor="floor" // 总楼层（一级页面评论）
      :DetailsTotal="DetailsTotal" // 二级页面总评论
      :DetailsMax="DetailsMax"  //数据懒加载，每次加载的数据量
      :textMax="textMax" // 评论输入的最大字数限制
      ref="_comment"
    />
    <div :style="{height:'60px'}"></div>
  </div>
</template>

component

| Name | Required | Type | Description | | ------------ | -------- | -------- | ------------------------------ | | load | true | Function | 一级页面加载更多回调 | | Loading | true | Function | 二级页面上拉加载 | | msgData | true | Array | 一级页面数据 | | DetailsData | true | Array | 二级页面数据 | | sortFun | true | Function | 排序选择器回调事件 | | total | true | Number | 总评论数 | | floor | true | Number | 总楼层数 | | DetailsTotal | true | Number | 二级页面评论数（当前楼层） | | DetailsMax | true | Number | 二级页面上拉加载每次最大数据量 | | textMax | true | Number | 输入评论最大字数限制 |

ref

| Name | parameter | Description | | ------- | ------------------------------------- | ------------------------------------------------------------ | | savafun | text,Landlord,Brother,callback | 提交评论回调，组件会注入：输入内容，楼层对象，平级回复对象，销毁事件 | | _filter | nodeData,pageSize,pageNum,sort,status | 二级页面渲染函数（可主动执行），组件接收参数：当前楼层，分页大小，当前分页，排序字段，当前状态 |