更新记录

0.1.8(2020-09-01)

新增v-model双向绑定、修复已知bug

0.1.7(2020-08-31)

修复已知bug

0.1.6(2020-08-28)

1、新增focus、blur、clear等事件和onFocus、onBlur等方法,见README文档 2、优化了一些小bug

查看更多

平台兼容性

vue-emoji-editor

Image text

说明 Introduction

本输入组件是基于HTML5的contenteditable和vue实现,可插入emoji、图片等
emoji列表和图片上传逻辑请自行实现,本组件只处理传进来的文字图片显示
添加emoji或上传后执行this.$refs.emoji.addEmoji(src) 即可在组件内显示
This component is based on HTML5 contenteditable and vue, 
which can insert emoji, pictures, etc
Please implement the emoji list and picture upload logic by yourself
Use this.$refs. Emojis. AddEmoji (SRC) to display in the component 
after adding emoji or uploading

安装 Install

npm i vue2-emoji-editor

使用 Quickstart

import EmojiComponent from 'vue2-emoji-editor'

<emoji-component
  ref="emoji"
  @change="change"
/>

属性 Attributes

参数说明类型默认值
v-model / value绑定值string-
disabled是否禁用booleanfalse
max可输入的最大长度 0则不限制number0
clearable是否可清空booleantrue
placeholder占位符string请输入...
autofocus是否自动聚焦booleanfalse
editorStyle输入框样式string-
border默认边框string1px solid #ddd
borderActive激活时边框string1px solid #409eff
imgStyle输入框内图片样式,如width: 52pxstring-

事件 Events

事件名称说明回调参数
change绑定值被改变时触发(value, length)
focus输入框获得焦点时触发(event: Event)
blur输入框失去焦点时触发(event: Event)
clear点击清除按钮时触发-

方法 Methods

方法名说明回调参数
addEmoji添加表情或图片(value, length)
clear清除内容-
getContent获取内容-
focus使输入框获取焦点-
blur使输入框失去焦点-

License

MIT Copyright (c) 2020-present, thegithubs

隐私、权限声明

1. 本插件需要申请的系统权限列表:

2. 本插件采集的数据、发送的服务器地址、以及数据用途说明:

插件不采集任何数据

3. 本插件是否包含广告,如包含需详细说明广告表达方式、展示频率:

许可协议

MIT协议

使用中有什么不明白的地方,就向插件作者提问吧~ 我要提问