{"repo":"hezhongfeng/im-fe-admin","free":true,"listed":false,"github":"https://github.com/hezhongfeng/im-fe-admin","clone":"git clone https://github.com/hezhongfeng/im-fe-admin.git","description":"IM application, including server, admin and client.即时通讯应用服务，包含服务端、管理端和客户端","language":"TypeScript","stars":23,"topics":["react","umi","dva","antd-design-pro","im","instant-messaging","chat"],"license":null,"category":"chat-messaging","readme_excerpt":"即时通讯应用, 包含服务端、管理端和客户端 现已部署上线，欢迎体验客户端和管理端 请不要随意更改默认角色和权限，请有点爱心，别整一些很不文明的名字 介绍 以 Ant Design Pro 为模板搭建，IM 服务的管理端 功能简介 1. 注册，登录，个人、群组聊天，个人信息编辑等基础功能 2. 申请添加好友和申请入群 3. 表情，图片，视频，定位信息支持 4. 聊天会话列表记录 5. 消息记录（微信的消息记录真实一言难尽） 6. 支持多点同时登录 7. 百度 UNIT 机器人自动聊天 8. 支持 github 一键登录 9. 管理端，进行角色和权限的管理，群状态管理（我也当一回马化腾） 安装依赖 启动调试 Build 从 Vue 全家桶切换过来的感悟 在使用 antd-design-pro 和 umi 之前，我是使用过 create-react-app 这个脚手架去学习 React 的语法的，感觉还不错，除了 this 绑定那里有点麻烦之外都挺好的。但是初始化完 V4 的 pro 的模板项目后我还是懵逼了。最主要的就是没有提供相关的文档说明，比如 src 下各个文件夹的作用和他们之间是如何让连接在一起工作的。下面我将以我的视角试着解释下各个文件夹的功能和怎么组合在一起工作的。 目录 项目的根目录没有什么可说的，和 @vue/cli 创建的不同，但是也能看懂，多了 ts 方面和 prettier 的配置，我自己添加了 cz，用来规范自己的提交信息格式。 dva 这个是必须要介绍的内容，因为 pro 里面到处充斥着 connect 这样的写法，看起来一脸懵逼 官方的解释是 dva = React-Router + Redux + Redux-saga ，在我看来这个东西就属于一个路由+状态管理，只不过这个状态管理不好理解，这时候感觉 React 没有官方的工具就显得轮子多了，据我所知就有好几种状态管理的方案，有选择困难症的同学压力很大。 Model 在我看来就是组件中的数据和方法，在 dva 中通过将 component 和 model 分离的方式来管理视图，包含同步更新 state 的 reducers，处理异步逻辑的 effects，订阅数据源的 subscriptions。 model 中有一个全局的 namespace，这个让我感觉到了和 vuex 的不同，Vue 项目中只有很少的一部分会用到全局的数据（比如用户登录信息），而 dva 的理想状态下是所有页面的状态都放在全局下，统一管理，这个确实比 Vue 的方式要统一一些，不过代价不小，如果我们目前的项目页面状态都采用这种方式的话，应该会很难受。 state 就是一份 Model 的状态数据，通常表现为一个 javascript 对象（当然它可以是任何值）,操作的时候每次都要当作不可变数据（immutable data）来对待，保证每次都是全新对象，没有引用关系，这样才能保证 State 的独立性，便于测试和追踪变化。 dispatch 这个概念也比较容易理解，就是通过 dispatch 发起一个 action，这个 action 有两种，分为同步的 Reducers 和异步的 Effects(副作用），effects 流向 Reducers 最终改变 State。 subscription 订阅现在使用的比较少，没有搞懂具体使用场景。 effects 处理异步操作和业务逻辑，较常用的是 call 、 put 和 select - call 用来发起异步逻辑的调用，比如 IO 操作或者 htt","default_branch":null,"files":null,"tree":[],"storefront":"/r/hezhongfeng","claimed":false,"request_supported":{"post":"https://gitbuyer.com/r/hezhongfeng/im-fe-admin/request-supported","requests":0},"note":"indexed from public GitHub; nothing is for sale on this page. Clone it from GitHub. Paid listings live at /search."}