聊天室 SDK 提问 UI
概述
本项目是保利威聊天室SDK提问 UI 组件,基于 Vue.js 2.x 编写,开发人员可以直接使用本组件或基于本组件进行定制。 如果您使用的是 React、Angular 等其他框架,可以参照本组件源代码自行实现。
使用
安装
npm i @polyv/chat-sdk@0.17.0-feature-aq.1 @polyv/chat-sdk-ui-ask-question@0.1.0-feature-aq.1
前者为 SDK,后者为 UI 组件。
配置 SDK
请参考聊天室 SDK的「引入」和「初始化」说明。 在 SDK 初始化完毕后,再控制组件加载。
注意,由于本组件是提问组件,故不用初始化Chat
SDK实例,但是需要初始化Ask
SDK实例,初始方法跟上述链接中初始化Chat
实例一致。
Ask
SDK提供了发送提问消息、发送提问图片消息、获取提问数据列表等基础方法。
方法
sendQuestion
说明:发送提问消息 返回值:无 参数列表
参数名 | 类型 | 是否必须 | 含义 |
---|---|---|---|
options | Object | 是 |
options说明
参数名 | 类型 | 是否必须 | 含义 |
---|---|---|---|
content | String | 是 | 提问内容 |
示例
askSdk.sendQuestion({ content: '今天星期几?' });
聊天室提问入口组件
聊天室提问入口组件包括消息列表、消息收发、查看大图、发送提问等基本功能,接入方仅需接入此组件并根据本文档指引进行快速集成。
引入
- 移动端
import AskCompPortrait from '@polyv/chat-sdk-ui-ask-question/lib/MobileAskPortrait/index';
使用方式
<AskCompPortrait
ref="askComp"
:askSdk="askSdk"
/>
attributes
属性名 | 类型 | 是否必须 | 含义 |
---|---|---|---|
askSdk | Object | 是 | 聊天室提问 SDK 实例,用于聊天室组件内部处理与服务端的 websocket 交互 |
width | Number | 否 | 宽度,默认100% |
height | Number | 否 | 高度,默认100% |
enableInput | Boolean | 否 | 是否使用输入框,默认为true |
placeholder | String | 否 | 输入框placeholder,默认为“发起提问” |
enableSendImage | Boolean | 否 | 是否使用图片上传,默认为true,只对PC生效 |
enablePasteImage | Boolean | 否 | 是否使用可粘贴图片输入框,默认为false,只对PC生效 |
slogan | String | 否 | 提示标语,默认为“你已进入专属的提问频道,提问内容不会公开” |
hideActorUserType | Array | 否 | 指定哪些类型的用户头衔不显示 |
若 askSdk 实例发生变化,聊天室组件内部会重新监听和绑定相应事件。