最美的时光|基于 Vue 网页版IM聊天组件Lemon-IMUI

今天给大家分享一款超棒的Vue桌面端IM聊天组件LemonIMUI 。
最美的时光|基于 Vue 网页版IM聊天组件Lemon-IMUIlemon-imui 基于 VUE2.x 的开源IM聊天室组件 。 支持自定义扩展功能 , 不依赖第三方组件库 。
最美的时光|基于 Vue 网页版IM聊天组件Lemon-IMUI特性

  • 拥有丰富的自定义功能 , 任意搭配出不同风格的聊天界面
  • 可以单独使用内部组件 , 比如编辑框/按钮/popover 等
  • 不依赖任何第三方组件库
  • 可任意扩展的聊天消息类型
安装$ npm i lemon-imui -S引入组件可在main.js中全局引入 , 也可以单独在.vue页面引入使用 。
import Vue from 'vue'import LemonIMUI from 'lemon-imui'Vue.use(LemonIMUI)// 使用
最美的时光|基于 Vue 网页版IM聊天组件Lemon-IMUI应用示例【最美的时光|基于 Vue 网页版IM聊天组件Lemon-IMUI】Lemon IMUI
{{ contact.displayName }}…自定义消息顶部自定义联系人顶部

最美的时光|基于 Vue 网页版IM聊天组件Lemon-IMUI
  • 右侧区域模板信息自定义

最美的时光|基于 Vue 网页版IM聊天组件Lemon-IMUILemon IMUI
  • 自定义消息、联系人顶部模板

最美的时光|基于 Vue 网页版IM聊天组件Lemon-IMUI
最美的时光|基于 Vue 网页版IM聊天组件Lemon-IMUI自定义消息顶部自定义联系人顶部
  • initEmoji初始化表情、收藏表情

最美的时光|基于 Vue 网页版IM聊天组件Lemon-IMUIlet { IMUI } = this.$refsIMUI.initEmoji([{label: '表情',children: [{name: '1f600',title: '微笑',src: ''},{name: '1f62c',title: '微笑',src: ''}// ...]},{label: '收藏',children: [{name: '1f62c',title: '微笑',src: ''}]}])
最美的时光|基于 Vue 网页版IM聊天组件Lemon-IMUI
最美的时光|基于 Vue 网页版IM聊天组件Lemon-IMUI