基于electorn构建的仿微信PC客户端
之前一直对web开发跨平台应用比较感兴趣，个人爱好广泛，也喜欢经常自己写点小工具之类的提升效率，一次无意中看到
electorn，觉得挺有意思，想写个小项目用于学习和练手
项目地址：jwchat-码云
效果对比图：
实现思路：
使用
electorn-vue脚手架实现快速创建项目，搭配ElementUI，香
界面拆分
登陆界面
登陆界面使用微信风格，添加传统账号密码输入框
先使用过渡动画，隐藏登陆表单，显示文字，然后在做切换
标题栏需要自己实现，设置css样式为 -webkit-app-region: drag; 即可使用鼠标对窗口进行拖拽，切记，例如标题栏的关闭窗口等需要操作的图标，需要去除拖拽属性 -webkit-app-region: no-drag;
主体聊天界面窗口
按照以上列表分块实现各个部分样式即可，主窗体各个功能切换使用路由跳转实现，点击左侧导航栏对中间窗体进行切换
聊天界面
聊天界面最重要的部分在于消息输入框，需要支持
文件、文字、图片、图文混合、表情包
contenteditable='true' 这个属性，把普通div标签变成可编辑的输入区域，详细实现见代码，支持图文混合，表情，文件选择，通过向输入框的div可编辑标签内插入自定义代码块，可以实现各种内容显示在输入框内
其他功能正在完善，长期更新