React Native Demo 介绍
React Native 可以让开发者使用 Javascript 和 React 开发原生 iOS 和 Android 应用,提高开发效率(Learn once, write anywhere)。
React Native Demo 已集成环信 Web IM SDK,并提供即时通讯基本功能,开发者可以直接将该 Demo 集成到您的应用中,立即获得即时通讯的能力。
GitHub 下载地址:https://github.com/easemob/webim-react-native
版本支持
React Native Demo 支持 iOS 9.0 以上版本,以及 Android 4.1 (API 16)。
注:所有开发调试环境均基于Mac。
功能
React Native Demo 分为 iOS Demo 和 Android Demo 两部分,已完成的功能如下。
iOS
iOS Demo 已完成功能:
• 登录
• 注册
• 好友
◦ 列表及筛选
◦ 好友信息展示
◦ 黑名单
◦ 删除好友
◦ 好友通知
◾ 添加好友通知展示
◾ 接受好友请求
◾ 拒绝好友请求
◾ 添加好友
• 群组
◦ 群组列表
◦ 群组成员列表
• 聊天
◦ 相机图片消息
◦ 本地图片消息
◦ emoji消息
◦ 普通消息
• 异常状态处理
◦ 断线退出到登录页
◦ 重复登录退出到登录页
Android
Android Demo 已完成功能:
• 登录
• 注册
目录结构
App 的目录结构如下:
• Containers: 容器 | 页面 | 路由
◦ App.js 总入口
◾ Redux/ 初始化
◾ I18n/ 初始化
◾ Config/index.js 系统初始配置
◦ RootContainer.js 根容器
◾ Navigation/NavigationRouter.js 初始化路由
◾ /Config/ReduxPersist 持久化初始化
• Components 常用组件
• I18n 多语言支持
• Images 图片资源
• Lib WebIM初始化
• Navigation: 路由相关
• Redux: actions / reducers
• Sdk: webim-easemobo SDK
Redux State
{ // ui相关 ui:[// ui通用:比如loading common: { fetching:false }, login: { username: '', password: '', isSigned: false, }, register: { }, contactInfo: { }, ], im: , // 数据实体 entities: { roster: { byName: { { jid, name, subscription, groups? } }, names:['lwz2'...], // 好友列表在此,因为好友列表来源于roster,息息相关 friends: , }, // 订阅通知 subscribe: { byFrom: {} }, room: {}, group: { byId: {}, names: }, members: { byName: , byGroupId: } blacklist: {}, message: { byId: {} chat: {[chatId]:[messageId1, messageId2] }, groupChat: {[chatId]: {} }, } }}
版本历史 :更新日志
SDK下载:点击下载