vue仿微信网页端vueWebChat聊天室|vue聊天IM系统|vue仿微信web版

xiaoyan2015 · · 3169 次点击 · 开始浏览置顶

这是一个创建于的主题，其中的信息可能已经有所发展或是发生改变。

> 前段时间就有使用html5技术开发过一个web版聊天室，后来想着用vue技术开发一版，后面由于各种事情，一直没能落定。最近有些空闲就使用vue开发了一个vueWechat聊天室项目。 > 使用了Vue2.5.6+Vuex+vue-router+vue-gemini-scrollbar+swiper+elementUI等技术开发，实现了发送消息、表情(动图)，图片、视频预览，仿微信右键菜单、网页截图可直接粘贴至编辑框发送。 > https://www.cnblogs.com/xiaoyan2017/p/10793728.html #### 技术框架 - MVVM框架：Vue2.5.6 - 状态管理：Vuex - 页面路由：Vue-router - iconfont图标：阿里巴巴字体图标库 - 自定义滚动条：vue-gemini-scrollbar - 弹窗组件：element-ui（饿了么前端UI库） - 环境配置：node.js + cnpm + webpack - 高德地图：vue-amap - 图片预览：vue-photo-preview ![001360截图20190429225233513.png](https://static.studygolang.com/190501/9141d7812c9ad5ddc69eddfe3f45e0ab.png) ![002360截图20190429225404663.png](https://static.studygolang.com/190501/114308079bcb57b78fce8fb6b4f2487d.png) ![003360截图20190429225544303.png](https://static.studygolang.com/190501/5f292870f50bc801c17ae6b5b0044383.png) ![004360截图20190429225824919.png](https://static.studygolang.com/190501/94a1af656e1ae48c0e4034168f9224cf.png) ![005360截图20190429225945884.png](https://static.studygolang.com/190501/05de6baa7dc121d9bcaf14107350dce7.png) ![006360截图20190429230254807.png](https://static.studygolang.com/190501/287b00c2ad6f8c507651aca741adb7bb.png) ![007360截图20190429230405160.png](https://static.studygolang.com/190501/2827196dfd896da1e4357a969e58b37d.png) ![008360截图20190429230519310.png](https://static.studygolang.com/190501/abb233683399caca1fae3f4e998770aa.png) ![009360截图20190429230828577.png](https://static.studygolang.com/190501/5a6422006167414e5167e8bddbb2c4f0.png) ![011360截图20190429231448608.png](https://static.studygolang.com/190501/bf432d866b883439f9bf7cbf385513ec.png) ![013360截图20190429231625431.png](https://static.studygolang.com/190501/b9fbf688a74240e9e4da49563ba09b24.png) ![016360截图20190429231834918.png](https://static.studygolang.com/190501/dd507c1439e911ba044bfb2af6c984c5.png) ——>>>欢迎一起交流学习 QQ：282310962 wx：xy190310

有疑问加站长微信联系（非本文作者）