自定义封面 Lemon IMUI
| 参数 | 说明 | 类型 | 默认值 | 示例 |
|---|---|---|---|---|
| id | 唯一ID | String/Number | - | |
| displayName | 名称 | String | - | |
| avatar | 头像 | String | - | |
| type | 会话类型:单聊:single | 群聊:many | String | - | |
| index | 通讯录索引,传入字母或数字进行排序,索引可以显示自定义文字“[A]最近联系人” | String | - | |
| unread | 未读消息数 | Number | 0 | |
| lastSendTime | 最近一条消息的时间戳 | timestamp | 0 | |
| lastSendTime | 最近一条消息的内容 | String | Vnode |
| 参数 | 说明 | 类型 | 默认值 | 示例 |
|---|---|---|---|---|
| id | 唯一ID | String/Number | - | |
| status | 消息发送的状态:going | failed | succeed | String | - | |
| type | 消息类型:voice | file | video | image | text | String | - | |
| sendTime | 消息发送时间 | timestamp | - | |
| content | 消息内容,如果type=file,此属性表示文件的URL地址 | String | - | |
| fileSize | 文件大小 | Number | 0 | |
| fileName | 文件名称 | String | - | |
| toContactId | 接收消息的联系人ID | String | Number | - | |
| fromUser | 消息发送人的信息 | Object | - | {id: "1",displayName: "测试",avatar: "url"}; |
| 参数 | 说明 | 类型 | 默认值 | 示例 |
|---|---|---|---|---|
| user | 用户信息 | Object | - | {id: "1",displayName: "测试",avatar: "url"}; |
| messageTimeFormat | 消息列表时间格式化函数 | Function(time)=>String | - | |
| contactTimeFormat | 联系人时间格式化规则 | Function(time)=>String | - | |
| hideDrawer | 是否隐藏抽屉 | Boolean | true | |
| hideMenuAvatar | 是否隐藏导航头像 | Boolean | false | |
| hideMenu | 是否隐藏左侧导航 | Boolean | false |
| 参数 | 说明 | 类型 | 默认值 | 示例 |
|---|---|---|---|---|
| initMenus | 初始化导航 | Function([Object]) | [ { name: "lastMessages" }, { name: "contacts" }] | { name: "custom2", title: "自定义按钮2", unread: 0, click: () => { alert("拦截导航点击事件"); }, render: menu => { return '...'; }, isBottom: true } |
| initContacts | 初始化联系人 | Function([Contact]) | - | |
| initEditorTools | 初始化工具栏 | Function([Object]) | [{name:'emoji'},{name:'uploadFile'},{name:'uploadImage'}] | [{ name:"test2", isRight:true, title:'上传 Excel', click:()=>{ alert('点击') }, render:()=>{ return '...' } }] |
| initEmoji | 初始化表情数据 | Function([Object]) | - |
有分类:[{
label: '默认表情',
children: [
{
name: '1f62c',
title: '微笑',
src: 'https://twemoji.maxcdn.com/2/72x72/1f62c.png'
}
]
}]
无分类:[{
name: '1f62c',
title: '微笑',
src: 'https://twemoji.maxcdn.com/2/72x72/1f62c.png'
}]
|
| appendMessage | 在当前聊天窗口插入一条新消息, scrollToBottom=true 添加之后滚动到消息窗口底部 | Function(Message,scrollToBottom=false) | - | |
| removeMessage | 删除聊天消息 | Function(Message.id,Contact.id) | - | |
| updateMessage | 修改一条消息 | Function(Message.id,Contact.id,Message) | - | |
| updateMessage | 修改联系人 | Function(Contact.id,Contact) | - | |
| getMessages | 返回所有本地消息,传入 Contact.id 则只返回与该联系人的消息 | Function(Contact.id)=>[Message] | - | |
| getContacts | 返回所有本地联系人 | Function()=>[Contact] | - | |
| openDrawer | 打开联系人右侧抽屉,vnode 为抽屉内容 | Function(vnode) | - | |
| changeDrawer | 切换右侧抽屉显示/隐藏,vnode 为抽屉内容 | Function(vnode) | - | |
| closeDrawer | 关闭抽屉 | Function() | - | |
| changeMenu | 切换左侧导航 | Function(Menu.name) | - | |
| changeContact | 切换聊天窗口 | Function(Contact.id) | - | |
| messageViewToBottom | 将当前聊天窗口滚动到底部 | Function() | - | |
| setLastContentRender | 设置左侧联系人最新消息的渲染函数 | Function(Message.type, (Message)=>vnode) | - | setLastContentRender('image', message => { return [最新图片] }) |
| lastContentRender | 用来生成 Message.lastContent 需要的vnode结构。 | Function(Message) | - |
| 插槽名 | 说明 | 参数 |
|---|---|---|
| cover | 初始化时的封面 | - |
| contact-title | 联系人标题 | Contact |
| message-sidebar | 左侧消息列表的顶部 | - |
| contact-sidebar | 左侧联系人列表的顶部 | - |
| contact-info | 左侧联系人详细页 | Contact |
| 事件名 | 说明 | 参数 |
|---|---|---|
| change-menu | 当左侧导航选项卡切换的时候会触发该事件 | Menu.name |
| menu-avatar-click | 当左侧导航内的头像被点击时回触发该事件 | Contact |
| change-contact | 当左侧联系人点击时会触发该事件 | Contact |
| pull-messages | 当切换聊天对象或者聊天窗口滚动到顶部时会触发该事件,调用next方法结束loading状态,如果设置了isEnd=true,下次聊天窗口滚动到顶部将不会再触发该事件 | Contact,next([Message],isEnd) |
| message-click | 点击聊天窗口中的消息时会触发该事件 | event,key,Message |
| send | 当发送一条新消息时会触发该事件 | Message,Function(Message):调用该函数完成消息发送,可以传入Message来改变消息内容,file:上传时的文件 |