V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
xiaoyan2017
V2EX  ›  推广

vue2.0 全家桶仿微信聊天室|vue 聊天模板

  •  
  •   xiaoyan2017 · 2019-04-07 17:51:47 +08:00 · 5503 次点击
    这是一个创建于 2038 天前的主题,其中的信息可能已经有所发展或是发生改变。

    基于 vue2.0+vue-cli+vuex+vue-router+webpack+es6+wcPop 等技术开发的仿微信聊天界面|仿微信聊天室 vue-chatRoom,新增了消息下拉刷新,实现了消息发送,图片、视频预览,打赏、红包等功能。 https://www.cnblogs.com/xiaoyan2017/p/10657781.html

    技术:

    • MVVM 框架:Vue2.0、vue-cli
    • 状态管理:Vuex
    • 页面路由:Vue-router
    • 弹窗插件:wcPop
    • 打包工具:webpack 2.0
    • 环境配置:node.js + cnpm
    • 图片插件:vue-photo-preview

    项目截图:

    <template>
      <div class="weChatIM__panel clearfix">
        <div class="we__chatIM-wrapper flexbox flex__direction-column">
          <!-- //顶部 -->
          <header-bar :class="{'topfixed': isTopFixed}"></header-bar>
    
          <!-- //主页面 -->
          <div class="wcim__container flex1">
            <keep-alive><router-view></router-view></keep-alive>
          </div>
    
          <!-- //底部 tab -->
          <tab-bar></tab-bar>
        </div>
      </div>
    </template>
    
    <script>
      import headerBar from './components/header'
      import tabBar from './components/footer'
      export default {
        name: 'app',
        data () {
          return {
            isTopFixed: true
          }
        },
        components: {
          headerBar,
          tabBar
        }
      }
    </script>
    
    <style>
      /* 引入公共样式 */
      @import './assets/fonts/iconfont.css';
      @import './assets/css/reset.css';
      @import './assets/css/layout.css';
    
    </style>
    

    欢迎大家一起交流、学习 Q:282310962 wx:xy190310

    1 条回复    2019-05-01 12:36:35 +08:00
    xiaoyan2017
        1
    xiaoyan2017  
    OP
       2019-05-01 12:36:35 +08:00
    vue 全家桶仿微信网页端聊天室 IM 系统
    https://www.cnblogs.com/xiaoyan2017/p/10793728.html
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   实用小工具   ·   5385 人在线   最高记录 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 28ms · UTC 03:47 · PVG 11:47 · LAX 19:47 · JFK 22:47
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.