ConversationListProvider
ConversationListProvider 作为整个 ConversationList 的包裹层，为 ConversationList 内部的所有组件提供上下文。ConversationListProvider 内部对 ChatEngine 中 Conversation 相关的数据进行监听处理，并传递给整个 ConversationList UI。Props
ConversationListProvider 接收两个可选参数 filter 和 sort 用于处理要展示的 conversationList 数据：参数名 | 类型 | 默认值 | 说明 |
filter | - | 用于筛选会话列表的函数。 | |
sort | - | 用于排序会话列表的函数。 |
基础使用
import { ConversationListProvider, IConversationListProps } from '@tencentcloud/chat-uikit-react';function CustomConversationList(props: IConversationListProps) {<ConversationListProvider filter={props.filter} sort={props.sort}><div>Custom ConversationList UI</div></ConversationListProvider>;}
useConversationList
ConversationListProvider 内的所有组件，均可以通过 useConversationList 读取和订阅 context 中的值。Value
useConversationList 提供的 context value 如下：参数名 | 类型 | 说明 |
conversationList | ChatEngine 中获取的原始的对话列表。 | |
filteredAndSortedConversationList | ConversationList 要渲染的对话列表。 这是经过 ConversationListProvider 过滤和排序后的对话列表。 | |
currentConversation | 当前打开的会话。 | |
setCurrentConversation | 设置当前打开的会话。 | |
isLoading | Boolean | 当前会话列表是否正在获取加载中。 |
isLoadError | Boolean | 当前会话列表是否获取错误。 |
基础使用
import {useConversationList} from '@tencentcloud/chat-uikit-react';const {conversationList,filteredAndSortedConversationList,currentConversation,setCurrentConversation} =useConversationList();
