easemob-chat-uikit 1.0.0-beta → 1.0.0-beta2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +5 -5
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -2,11 +2,11 @@
|
|
|
2
2
|
|
|
3
3
|
## 简介
|
|
4
4
|
|
|
5
|
-
easemob-chat-uikit 是基于环信 Chat SDK 的一款 UI 组件库，提供通用的 UI 组件，和包含聊天业务逻辑的 module 组件，以及可以完整使用的容器组件， 容器组件允许用户使用 renderX 方法来进行自定义。
|
|
5
|
+
easemob-chat-uikit 是基于环信 Chat SDK 的一款 UI 组件库，提供通用的 UI 组件，和包含聊天业务逻辑的 module 组件，以及可以完整使用的容器组件， 容器组件允许用户使用 renderX 方法来进行自定义。easemob-chat-uikit 提供 provider 来管理数据，provider 自动监听 SDK 事件，来更新数据，并驱动 UI 更新。开发者可根据实际业务需求利用该库快速搭建自定义 IM 应用。
|
|
6
6
|
|
|
7
7
|
## 技术原理
|
|
8
8
|
|
|
9
|
-
UIKIt 由三部分组成：UI 组件，管理数据的 mobx store, chat SDK。UI 组件包含容器组件 container 复合组件 module, 以及纯 UI 组件 components, 这些不同级别的组件全部对外暴露，用户可以引用任意组件构建自己的应用。UIkit 使用 mobx 管理全局数据，用户可以引用 rootStore 来获得全部数据和 action 方法，可以用 action 方法来操作数据。 UIKit 内部集成了 chat SDK，通过 chat SDK 和服务器交互。<div align=center> <img src="
|
|
9
|
+
UIKIt 由三部分组成：UI 组件，管理数据的 mobx store, chat SDK。UI 组件包含容器组件 container 复合组件 module, 以及纯 UI 组件 components, 这些不同级别的组件全部对外暴露，用户可以引用任意组件构建自己的应用。UIkit 使用 mobx 管理全局数据，用户可以引用 rootStore 来获得全部数据和 action 方法，可以用 action 方法来操作数据。 UIKit 内部集成了 chat SDK，通过 chat SDK 和服务器交互。<div align=center> <img src="https://github.com/easemob/Easemob-UIKit-web/blob/dev/docs/uikit.png" width = "400" height = "450" /></div>
|
|
10
10
|
|
|
11
11
|
## 功能
|
|
12
12
|
|
|
@@ -372,7 +372,7 @@ const ChatApp = () => {
|
|
|
372
372
|
client
|
|
373
373
|
.open({
|
|
374
374
|
user: '',
|
|
375
|
-
|
|
375
|
+
pwd: '',
|
|
376
376
|
})
|
|
377
377
|
.then(res => {
|
|
378
378
|
console.log('get token success', res);
|
|
@@ -422,7 +422,7 @@ npm run start
|
|
|
422
422
|
|
|
423
423
|
在浏览器可看到你的应用。
|
|
424
424
|
|
|
425
|
-
<div align=center style="background: #ddd; padding-top: 8px"> <img src="
|
|
425
|
+
<div align=center style="background: #ddd; padding-top: 8px"> <img src="https://github.com/easemob/Easemob-UIKit-web/blob/dev/docs/chat.png" width = "480" height = "350" /></div>
|
|
426
426
|
|
|
427
427
|
在默认 App Key 情况下，为方便快速体验，我们默认支持几种类型的消息下发。点击选中一个成员后，输入你的第一条消息并发送。
|
|
428
428
|
|
|
@@ -452,7 +452,7 @@ const ChatApp = () => {
|
|
|
452
452
|
可以通过容器组件的 renderX 方法来渲染自定义组件
|
|
453
453
|
|
|
454
454
|
```javascript
|
|
455
|
-
import {Chat, Header} from '
|
|
455
|
+
import {Chat, Header} from 'easemob-chat-uikit'
|
|
456
456
|
|
|
457
457
|
const ChatApp = () => {
|
|
458
458
|
const CustomHeader = <Header back content="Custom Header">
|