Vue3

最近更新时间:2025-09-12 18:14:53

我的收藏

概述

Vue3 MessageList 组件支持已读回执能力:
在单聊中,己方发送的消息会独立判断对方是否已读。
在群聊中,己方发送的消息会独立判断某位群成员是否已读,且可以展示已读详情列表。

效果展示



快速使用

Vue3 UIKit 组件提供了 MessageList 组件,在 MessageList 组件上将 enableReadReceipt 属性置为 true 即视为开启已读回执(默认值为 false)。
<template>
<UIKitProvider
theme="dark"
language="zh-CN"
>
<div :style="{ display: 'flex', height: '100vh' }">
<ConversationList :style="{ minWidth: '30%' }" />
<Chat>
<ChatHeader />
<!-- 开启已读回执功能 -->
<MessageList :enableReadReceipt="true" />
<MessageInput />
</Chat>
</div>
</UIKitProvider>
</template>

<script setup lang="ts">
import {
Chat,
ChatHeader,
ConversationList,
MessageInput,
MessageList,
UIKitProvider,
} from '@tencentcloud';
</script>

相关文档

交流与反馈

如遇任何问题,可联系 官网售后 反馈,享有专业工程师的支持,解决您的难题。