基于 vue.js 的仿QQ聊天室

编程知识 更新时间:2023-05-03 03:41:22

简介
这是一款基于 vue.js 开发的聊天室组件库,在提供基础封装的同时,最大程度的增加扩展性。
下面是效果演示图:





MChat组件效果图:


IChat组件效果图:




如何安装
使用 npm 安装

npm install vue-mchat

使用
在main.js中引入

# npm 下载方式
// 进入css
import 'MChat/lib/MChat.css'
//引入组件
import MChat from 'MChat'
// 使用vue加载组件
Vue.use(MChat)
#

如何进行二次开发
方案一:
直接将 pacages 文件夹复制到你需要的项目,在 main.js 中引入 vue-mchat:

import App from './App.vue'
import MChat from '../packages/index'

Vue.use(MChat)

方案二:
在 vue-mchat 的基础上进行开发,通过打包成js库引入:

在 vue-mchat 目录下执行:

npm run lib

可获得 lib 文件其中包含 MChat 的编译文件库,将 lib 整个复制到项目里,在 main.js 中引入:

import  '../lib/MChat.css'
import MChat from '../lib/MChat.umd'

Vue.use(MChat)

喜欢的同学关注公众号之后回复关键字1128,即可获取源码哦!

更多推荐

基于 vue.js 的仿QQ聊天室

本文发布于:2023-04-30 10:38:00,感谢您对本站的认可!
本文链接:https://www.elefans.com/category/jswz/664138c92f71b70d0ad47bbf32f63ac1.html
版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系,我们将在24小时内删除。
本文标签:聊天室   vue   js   QQ

发布评论

评论列表 (有 0 条评论)
草根站长

>www.elefans.com

编程频道|电子爱好者 - 技术资讯及电子产品介绍!

  • 114073文章数
  • 28911阅读数
  • 0评论数