vue 引入 emoji 表情包

?

1 2	//npm下载 npm install --save emoji-mart-vue

　　

 // template 应用

?

1 2 3 4 5

import { Picker } from "emoji-mart-vue"; //引入组件   components: { //注册组件，不能全局挂载     Picker   }

　　// 直接丢在输入框上边就行

?

1	<picker :include="['people','Smileys']" :showSearch="false" :showPreview="false" :showCategories="false" @select="addEmoji" />

　　

// 输入框的变量 + 表情包文字

?

1 2 3

addEmoji(e){       this.content += e.native;     },

　　

//最后是 css 消除文字

?

1 2 3 4 5 6 7 8 9 10 11 12

.emoji-mart[data-v-7bc71df8] {   font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", sans-serif;   display: -ms-flexbox;   display: flex;   -ms-flex-direction: column;   flex-direction: column;   height: 420px;   color: #ffffff !important;   border: 1px solid #d9d9d9;   border-radius: 5px;   background: #fff; }

　　

//效果图