logoAnt Design X

设计研发组件X MarkdownX SDK演示
  • 介绍
  • 数据流
    • useXChat会话数据
    • useXConversations会话管理
    • 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
基础使用
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",
  "disabled": false
}
会话操作
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! How can I assist you today?
hello!
配合useXChat对话消息管理
CodeSandbox Icon
codepen icon
External Link Icon
expand codeexpand code