集成会话列表界面

更新时间: 2023/07/21 06:56:54

会话列表组件(conversation-kit)主要功能为显示当前用户的会话(单聊和群聊)列表,同时提供会话点击和右键菜单功能对会话进行操作。

界面效果

Web会话列表930.png

界面集成

在您的 React 项目中导入会话列表组件,并设置会话列表界面尺寸,即可集成 IM UIKit 默认的会话列表界面。

示例代码如下:

import React from 'react'
import { ConversationContainer } from '@xkit-yx/im-kit-ui'

import '@xkit-yx/im-kit-ui/es/style'

const Page1 = () => {
  return (
    <div style={{ width: '30vw', height: '100%' }}>
      <ConversationContainer />
    </div>
  )
}

IM UIKit 默认的会话列表界面,支持如下功能:

  • 会话点击支持功能
    • 选中会话
    • 重置会话未读数
  • 右键菜单支持功能
    • 设置会话免打扰
    • 删除会话

相关信息

如果默认的界面 UI 无法满足您的业务需求,请参考自定义会话列表界面 UI进行自定义。

此文档是否对你有帮助?
有帮助
去反馈
  • 界面效果
  • 界面集成
  • 相关信息