logoAnt Design X

设计研发组件X MarkdownX SDK演示国内镜像
  • 介绍
  • 数据流
    • useXChat会话数据
    • useXConversations会话管理
  • 数据提供
    • Chat Provider数据提供
    • OpenAIChatProvider
    • DeepSeekChatProvider
    • Custom Chat Provider自定义
  • 工具
    • XRequest请求
    • XStream流

useXConversations
会话管理

何时使用

  • 需要进行会话列表管理,包括会话创建、删除、更新等操作时使用。

代码演示

API

useXConversations

tsx
type useXConversations = (config: XConversationConfig) => {
conversations: ConversationData[];
addConversation: (conversation: ConversationData) => boolean;
removeConversation: (key: string) => boolean;
setConversation: (key: string, conversation: ConversationData) => boolean;
getConversation: (key: string) => ConversationData;
setConversations: (conversations: ConversationData[]) => boolean;
};

XConversationConfig

tsx
interface XConversationConfig {
defaultConversations?: ConversationData[];
defaultActiveConversationKey?: string;
}

ConversationData

tsx
interface ConversationData extends AnyObject {
key: string;
label?: string;
}
  • Conversation Item 1
  • Conversation Item 2
  • This's Conversation Item 3, you can click me!
  • Conversation Item 4
基础使用

使用 useXConversations 管理会话列表,展示基本的会话项目配置和交互功能。

CodeSandbox Icon
codepen icon
External Link Icon
expand codeexpand code
  • Conversation Item 1
  • Conversation Item 2
  • This's Conversation Item 3, you can click me!
  • Conversation Item 4
Current Conversation Data:
{
  "key": "item1",
  "label": "Conversation Item 1"
}
会话操作

展示会话的完整操作能力,包括动态添加、更新、删除、重置会话项目,以及获取当前会话数据。

CodeSandbox Icon
codepen icon
External Link Icon
expand codeexpand code

List 1

  • Conversation Item 1
  • Conversation Item 2
  • This's Conversation Item 3, you can click me!
  • Conversation Item 4

List 2

  • Conversation Item 1
  • Conversation Item 2
多实例

展示多个会话实例的独立管理,支持添加、更新、删除会话项目,实现完全解耦的状态管理。

CodeSandbox Icon
codepen icon
External Link Icon
expand codeexpand code
  • Conversation Item 1
  • Conversation Item 2
  • This's Conversation Item 3, you can click me!
  • Conversation Item 4
Hello! This is the welcome message for Conversation 1. I can help you answer various questions.
Hello, this is Conversation 1!
配合 useXChat 对话消息管理

结合 useXConversations 和 useXChat 实现会话管理与聊天功能的完整集成,支持多会话独立聊天和上下文切换。

CodeSandbox Icon
codepen icon
External Link Icon
expand codeexpand code