更新记录

1.0(2021-05-31)

评论回复点赞


平台兼容性

Vue2 Vue3
×
App 快应用 微信小程序 支付宝小程序 百度小程序 字节小程序 QQ小程序
HBuilderX 3.1.8 × × × × ×
钉钉小程序 快手小程序 飞书小程序 京东小程序
× × × ×
H5-Safari Android Browser 微信浏览器(Android) QQ浏览器(Android) Chrome IE Edge Firefox PC-Safari
× × × × × × × ×

comments数据保存格式:

[
                {
                    id: 1, // 评论唯一标识id
                    avatar: 'https//xxx', // 头像地址
                    nickname: 'zzz', // 评论者姓名
                    content: '我是评论。', // 评论
                    addTime: '刚刚', // 评论时间
                    isLike: '0', // 查看评论的用户是否点赞了该评论
                    likeNums: 26, // 该评论的点赞数
                    layer: 1, // 该评论所在的层级
                    superNickname: null, // 上级评论的用户名
                    superCommentId: null, // 上级评论的id
                    children: [
                        {
                            id: 2,
                            avatar: 'https//xxx',
                            nickname: '程序猿2',
                            content: '我是回复。',
                            addTime: '刚刚',
                            isLike: '0',
                            likeNums: 23,
                            layer: 2,
                            superNickname: 'zzz',
                            superCommentId: 1
                        },
                        {
                            id: 3,
                            avatar: 'https//xxx',
                            nickname: '马老师',
                            content: '我是回复的回复。',
                            addTime: '刚刚',
                            isLike: '0',
                            likeNums: 69,
                            layer: 3,
                            superNickname: '程序猿2',
                            superCommentId: 1
                        }
                    ]
                }
            ]

eg:

<zwz-comment :comments="comments" @comment-like="commentLike" @send-comment="commentSend" v-model="commentText" @lower="lower" @reply="reply"></zwz-comment>

v-model:评论内容双向绑定。

event

comment-like :点赞触发事件。

commentLike(e) {
            console.log('返回点击的评论信息', e);
        },

send-comment:发送触发事件。

commentSend() {

}

lower:评论滑块到底触发事件。

lower() {
            console.log('到底了');
        }

reply:点击回复触发事件。

reply(index, id, userNickName, layer, reply) {
            console.log(index, id, userNickName, layer, reply);
    // index: 回复的顶级评论的索引
    // id: 回复的顶级评论的id
    // ueserNickName: 上级评论的用户名
    // layer:  改回复所处的层级
    // reply: 回复评论的全部信息
        }

隐私、权限声明

1. 本插件需要申请的系统权限列表:

2. 本插件采集的数据、发送的服务器地址、以及数据用途说明:

插件不采集任何数据

3. 本插件是否包含广告,如包含需详细说明广告表达方式、展示频率:

许可协议

MIT协议

使用中有什么不明白的地方,就向插件作者提问吧~ 我要提问