推荐一个好用的支持中文Emoji表情符号Vue输入框组件

一、背景

一个项目中需要用到输入表情符号，全网找了半天都是国外那种样式的表情输入插件，而且又非常难看，不能自定义修改样式。于是乎自己直接上手干了。

二、支持功能

支持中文分类
支持中英文搜索
支持最近输入表情
支持自定义扩展更多的表情
支持输入框样式自定义

三、获取

源码可以来uniapp插件市场这里获取：https://ext.dcloud.net.cn/plugin?id=26914

四、使用方法

如果你是uniapp项目，下载后可以直接使用，代码会自动下载到你的uni_modules目录下并会自动加载组件，无需自己再引入组件；如果你是普通Vue项目，将下载下来的代码放到 components目录，然后手动引入下组件即可。

说明：没有做 npm 直接安装方式，主要考虑到开发者拿到代码后可以自行修改样式和功能。

Vue2 使用方法，Vue3兼容Vue2写法

<template>
    <div style="display: flex;align-items: center">
        <emoji-input v-model="inputVal" style="width: 500px"></emoji-input>
        <div style="margin-left: 10px">你的输入：{{inputVal}}</div>
    </div>
</template>
 
<script>
// 引入插件
import EmojiInput from "@/components/xv-emoji/emoji-input.vue";
 
export default {
    name: 'VueEmojiPicker',
    components: {EmojiInput},
    data() {
        return {
            inputVal:'',
        }
    },
}
</script>

如果对你有帮助，请动动你发财的小手指，给个小心心鼓励下我...