交代下编写环境 : vue + element
使用emoji 首先要注意的是emoji的格式,emoji的编码格式是Unicode格式,数据库储存的格式是utf-8,如果想要兼容Unicode 则需要转换成 utf8mb4格式。
先看效果:
手机上展示:
内容不同请不要在意。
前端部分如下:
<template>
<div>
<div style="width:90%" class="flex-center-between">
<div style="width:60%">
<el-form-item label-width="16%" label="转发话术:" prop="shareText">
<el-input type="textarea" :rows="3" placeholder="请填写转发话术" v-model="shareText" clearable resize="none" @change="shareTextInputBtn()" class="shareText"></el-input>
</el-form-item>
</div>
</div>
<div style="width:90%">
<!-- // #TODO emoji html -->
<div class="emojilist m-t-20">
<template>
<el-tabs v-model="emojiTabsCheckType" type="border-card" @tab-click="emojiTabsCheckBtn()">
<el-tab-pane label="表情" name="emoji">
<div class="flex-start-start w-100p word-warp emojiItem">
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('😀')">😀</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('😁')">😁</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('😂')">😂</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('😃')">😃</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('😄')">😄</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('😅')">😅</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('😆')">😆</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('😉')">😉</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('😊')">😊</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('😋')">😋</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('😎')">😎</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('😍')">😍</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('😘')">😘</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('😗')">😗</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('😙')">😙</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('😚')">😚</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('☺')">☺</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🙂')">🙂</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🤗')">🤗</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🤔')">🤔</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('😐')">😐</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('😑')">😑</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('😶')">😶</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🙄')">🙄</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('😏')">😏</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('😣')">😣</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('😥')">😥</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('😮')">😮</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🤐')">🤐</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('😯')">😯</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('😪')">😪</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('😫')">😫</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('😴')">😴</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('😌')">😌</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('😛')">😛</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('😜')">😜</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('😝')">😝</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🤤')">🤤</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('😒')">😒</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('😓')">😓</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('😔')">😔</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('😕')">😕</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🙃')">🙃</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🤑')">🤑</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('😲')">😲</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('😖')">😖</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('😞')">😞</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('😟')">😟</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('😤')">😤</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('😢')">😢</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('😭')">😭</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('😦')">😦</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('😧')">😧</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('😨')">😨</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('😩')">😩</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('😬')">😬</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('😰')">😰</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('😱')">😱</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('😳')">😳</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('😵')">😵</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('😡')">😡</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('😠')">😠</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('😷')">😷</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🤒')">🤒</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🤕')">🤕</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🤢')">🤢</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🤧')">🤧</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('😇')">😇</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🤠')">🤠</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🤡')">🤡</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🤥')">🤥</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🤓')">🤓</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('😈')">😈</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('👿')">👿</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('👹')">👹</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('👺')">👺</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('💀')">💀</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('👻')">👻</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('👽')">👽</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🤖')">🤖</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('💩')">💩</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('😺')">😺</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('😸')">😸</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('😹')">😹</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('😻')">😻</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('😼')">😼</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('😽')">😽</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🙀')">🙀</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('😿')">😿</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('😾')">😾</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🗣')">🗣</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('👤')">👤</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('👥')">👥</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('👫')">👫</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('👶')">👶</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('👦')">👦</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('👧')">👧</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('👨')">👨</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('👩')">👩</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('👴')">👴</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('👵')">👵</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('👨⚕️')">👨⚕️</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('👩⚕️')">👩⚕️</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('👨🎓')">👨🎓</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('👩🎓')">👩🎓</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('👨🏫')">👨🏫</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('👨⚖️')">👨⚖️</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('👩⚖️')">👩⚖️</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('👨🌾')">👨🌾</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('👩🌾')">👩🌾</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('👨🏻🍳')">👨🏻🍳</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('👩🍳')">👩🍳</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('👨🔧')">👨🔧</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('👩🏼🔧')">👩🏼🔧</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('👨🏭')">👨🏭</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('👩🏭')">👩🏭</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('👩💼')">👩💼</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('👨🔬')">👨🔬</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('👨🏼💻')">👨🏼💻</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('👨🎤')">👨🎤</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('👩🎤')">👩🎤</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('👨✈️')">👨✈️</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('👨🚀')">👨🚀</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('👨🚒')">👨🚒</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('👮')">👮</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🕵')">🕵</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('💂')">💂</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('👷')">👷</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('👸')">👸</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('👳')">👳</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('👲')">👲</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('👱')">👱</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('👱♀️')">👱♀️</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🤵')">🤵</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('👰')">👰</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🤰')">🤰</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('👼')">👼</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🎅')">🎅</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🤶')">🤶</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🙍')">🙍</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🙍♂️')">🙍♂️</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🙅♂️')">🙅♂️</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🙆♂️')">🙆♂️</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('💁')">💁</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🙋')">🙋</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🙇')">🙇</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🤦')">🤦</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🤷')">🤷</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('💆')">💆</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('💇')">💇</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('💇♂️')">💇♂️</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🤳')">🤳</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('💪')">💪</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('👈')">👈</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('👉')">👉</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('☝')">☝</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🖕')">🖕</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('👇')">👇</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('✌')">✌</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🤞')">🤞</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🖖')">🖖</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🤘')">🤘</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🤙')">🤙</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🖐')">🖐</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('✋')">✋</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('👌')">👌</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('👍')">👍</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('👎')">👎</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('✊')">✊</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('👊')">👊</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🤛')">🤛</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🤜')">🤜</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🤚')">🤚</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('👋')">👋</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('✍')">✍</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('👏')">👏</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('👐')">👐</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🙌')">🙌</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🙏')">🙏</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🤝')">🤝</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('💅')">💅</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('👂')">👂</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('👃')">👃</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('👣')">👣</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('👀')">👀</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('👅')">👅</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('👄')">👄</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('💋')">💋</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🕶')">🕶</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('👔')">👔</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('👕')">👕</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('👖')">👖</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('👗')">👗</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('👘')">👘</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('👙')">👙</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('👚')">👚</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('👛')">👛</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('👜')">👜</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('👝')">👝</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🎒')">🎒</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('👞')">👞</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('👟')">👟</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('👠')">👠</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('👡')">👡</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('👢')">👢</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('👑')">👑</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('👒')">👒</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🎩')">🎩</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🎓')">🎓</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('⛑')">⛑</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('💄')">💄</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('💍')">💍</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🌂')">🌂</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('💼')">💼</a>
</div>
</el-tab-pane>
<el-tab-pane label="国旗" name="nationalFlag">
<div class="flex-start-start w-100p flex-wrap-wrap flex-wrap-wrap emojiItem">
<a href="javascript:;" class="btn-emoji" title="彩虹旗" @click="emojiBtn('🏳️🌈')">🏳️🌈</a>
<a href="javascript:;" class="btn-emoji" title="中国" @click="emojiBtn('🇨🇳')">🇨🇳</a>
<a href="javascript:;" class="btn-emoji" title="安道尔公国" @click="emojiBtn('🇦🇩')">🇦🇩</a>
<a href="javascript:;" class="btn-emoji" title="阿拉伯联合酋长国" @click="emojiBtn('🇦🇪')">🇦🇪</a>
<a href="javascript:;" class="btn-emoji" title="阿富汗" @click="emojiBtn('🇦🇫')">🇦🇫</a>
<a href="javascript:;" class="btn-emoji" title="安提瓜和巴布达" @click="emojiBtn('🇦🇬')">🇦🇬</a>
<a href="javascript:;" class="btn-emoji" title="安圭拉" @click="emojiBtn('🇦🇮')">🇦🇮</a>
<a href="javascript:;" class="btn-emoji" title="阿尔巴尼亚共和国" @click="emojiBtn('🇦🇱')">🇦🇱</a>
<a href="javascript:;" class="btn-emoji" title="亚美尼亚共和国" @click="emojiBtn('🇦🇲')">🇦🇲</a>
<a href="javascript:;" class="btn-emoji" title="安哥拉共和国" @click="emojiBtn('🇦🇴')">🇦🇴</a>
<a href="javascript:;" class="btn-emoji" title="南极洲" @click="emojiBtn('🇦🇶')">🇦🇶</a>
<a href="javascript:;" class="btn-emoji" title="阿根廷共和国" @click="emojiBtn('🇦🇷')">🇦🇷</a>
<a href="javascript:;" class="btn-emoji" title="奥地利共和国" @click="emojiBtn('🇦🇹')">🇦🇹</a>
<a href="javascript:;" class="btn-emoji" title="澳大利亚" @click="emojiBtn('🇦🇺')">🇦🇺</a>
<a href="javascript:;" class="btn-emoji" title="阿塞拜疆共和国" @click="emojiBtn('🇦🇿')">🇦🇿</a>
<a href="javascript:;" class="btn-emoji" title="波斯尼亚和黑塞哥维纳" @click="emojiBtn('🇧🇦')">🇧🇦</a>
<a href="javascript:;" class="btn-emoji" title="孟加拉共和国" @click="emojiBtn('🇧🇩')">🇧🇩</a>
<a href="javascript:;" class="btn-emoji" title="比利时" @click="emojiBtn('🇧🇪')">🇧🇪</a>
<a href="javascript:;" class="btn-emoji" title="布基纳法索" @click="emojiBtn('🇧🇫')">🇧🇫</a>
<a href="javascript:;" class="btn-emoji" title="保加利亚" @click="emojiBtn('🇧🇬')">🇧🇬</a>
<a href="javascript:;" class="btn-emoji" title="巴林王国" @click="emojiBtn('🇧🇭')">🇧🇭</a>
<a href="javascript:;" class="btn-emoji" title="布隆迪共和国" @click="emojiBtn('🇧🇮')">🇧🇮</a>
<a href="javascript:;" class="btn-emoji" title="贝宁共和国" @click="emojiBtn('🇧🇯')">🇧🇯</a>
<a href="javascript:;" class="btn-emoji" title="文莱" @click="emojiBtn('🇧🇳')">🇧🇳</a>
<a href="javascript:;" class="btn-emoji" title="玻利维亚国" @click="emojiBtn('🇧🇴')">🇧🇴</a>
<a href="javascript:;" class="btn-emoji" title="Brazil" @click="emojiBtn('🇧🇷')">🇧🇷</a>
<a href="javascript:;" class="btn-emoji" title="巴哈马国" @click="emojiBtn('🇧🇸')">🇧🇸</a>
<a href="javascript:;" class="btn-emoji" title="不丹" @click="emojiBtn('🇧🇹')">🇧🇹</a>
<a href="javascript:;" class="btn-emoji" title="博茨瓦纳" @click="emojiBtn('🇧🇼')">🇧🇼</a>
<a href="javascript:;" class="btn-emoji" title="白俄罗斯" @click="emojiBtn('🇧🇾')">🇧🇾</a>
<a href="javascript:;" class="btn-emoji" title="伯利兹" @click="emojiBtn('🇧🇿')">🇧🇿</a>
<a href="javascript:;" class="btn-emoji" title="加拿大" @click="emojiBtn('🇨🇦')">🇨🇦</a>
<a href="javascript:;" class="btn-emoji" title="中非共和国" @click="emojiBtn('🇨🇫')">🇨🇫</a>
<a href="javascript:;" class="btn-emoji" title="刚果共和国" @click="emojiBtn('🇨🇬')">🇨🇬</a>
<a href="javascript:;" class="btn-emoji" title="瑞士" @click="emojiBtn('🇨🇭')">🇨🇭</a>
<a href="javascript:;" class="btn-emoji" title="科特迪瓦共和国" @click="emojiBtn('🇨🇮')">🇨🇮</a>
<a href="javascript:;" class="btn-emoji" title="智利共和国" @click="emojiBtn('🇨🇰')">🇨🇰</a>
<a href="javascript:;" class="btn-emoji" title="喀麦隆" @click="emojiBtn('🇨🇲')">🇨🇲</a>
<a href="javascript:;" class="btn-emoji" title="哥伦比亚" @click="emojiBtn('🇨🇴')">🇨🇴</a>
<a href="javascript:;" class="btn-emoji" title="哥斯达黎加共和国" @click="emojiBtn('🇨🇷')">🇨🇷</a>
<a href="javascript:;" class="btn-emoji" title="佛得角共和国" @click="emojiBtn('🇨🇻')">🇨🇻</a>
<a href="javascript:;" class="btn-emoji" title="塞浦路斯共和国" @click="emojiBtn('🇨🇾')">🇨🇾</a>
<a href="javascript:;" class="btn-emoji" title="德国" @click="emojiBtn('🇩🇪')">🇩🇪</a>
<a href="javascript:;" class="btn-emoji" title="吉布提共和国" @click="emojiBtn('🇩🇯')">🇩🇯</a>
<a href="javascript:;" class="btn-emoji" title="丹麦" @click="emojiBtn('🇩🇰')">🇩🇰</a>
<a href="javascript:;" class="btn-emoji" title="多米尼克国" @click="emojiBtn('🇩🇲')">🇩🇲</a>
<a href="javascript:;" class="btn-emoji" title="多米尼加共和国" @click="emojiBtn('🇩🇴')">🇩🇴</a>
<a href="javascript:;" class="btn-emoji" title="阿尔及利亚" @click="emojiBtn('🇩🇿')">🇩🇿</a>
<a href="javascript:;" class="btn-emoji" title="厄瓜多尔共和国" @click="emojiBtn('🇪🇨')">🇪🇨</a>
<a href="javascript:;" class="btn-emoji" title="爱沙尼亚共和国" @click="emojiBtn('🇪🇪')">🇪🇪</a>
<a href="javascript:;" class="btn-emoji" title="埃及" @click="emojiBtn('🇪🇬')">🇪🇬</a>
<a href="javascript:;" class="btn-emoji" title="西班牙" @click="emojiBtn('🇪🇸')">🇪🇸</a>
<a href="javascript:;" class="btn-emoji" title="埃塞俄比亚" @click="emojiBtn('🇪🇹')">🇪🇹</a>
<a href="javascript:;" class="btn-emoji" title="芬兰" @click="emojiBtn('🇫🇮')">🇫🇮</a>
<a href="javascript:;" class="btn-emoji" title="斐济共和国" @click="emojiBtn('🇫🇯')">🇫🇯</a>
<a href="javascript:;" class="btn-emoji" title="密克罗尼西亚联邦" @click="emojiBtn('🇫🇲')">🇫🇲</a>
<a href="javascript:;" class="btn-emoji" title="法国" @click="emojiBtn('🇫🇷')">🇫🇷</a>
<a href="javascript:;" class="btn-emoji" title="加蓬共和国" @click="emojiBtn('🇬🇦')">🇬🇦</a>
<a href="javascript:;" class="btn-emoji" title="英国" @click="emojiBtn('🇬🇧')">🇬🇧</a>
<a href="javascript:;" class="btn-emoji" title="格鲁吉亚" @click="emojiBtn('🇬🇪')">🇬🇪</a>
<a href="javascript:;" class="btn-emoji" title="加纳共和国" @click="emojiBtn('🇬🇭')">🇬🇭</a>
<a href="javascript:;" class="btn-emoji" title="直布罗陀" @click="emojiBtn('🇬🇮')">🇬🇮</a>
<a href="javascript:;" class="btn-emoji" title="格陵兰岛" @click="emojiBtn('🇬🇱')">🇬🇱</a>
<a href="javascript:;" class="btn-emoji" title="冈比亚共和国" @click="emojiBtn('🇬🇲')">🇬🇲</a>
<a href="javascript:;" class="btn-emoji" title="几内亚共和国" @click="emojiBtn('🇬🇳')">🇬🇳</a>
<a href="javascript:;" class="btn-emoji" title="赤道几内亚" @click="emojiBtn('🇬🇶')">🇬🇶</a>
<a href="javascript:;" class="btn-emoji" title="危地马拉共和国" @click="emojiBtn('🇬🇹')">🇬🇹</a>
<a href="javascript:;" class="btn-emoji" title="几内亚比绍共和国"@click="emojiBtn('🇬🇼')">🇬🇼</a>
<a href="javascript:;" class="btn-emoji" title="圭亚那"@click="emojiBtn('🇬🇾')">🇬🇾</a>
<a href="javascript:;" class="btn-emoji" title="洪都拉斯"@click="emojiBtn('🇭🇳')">🇭🇳</a>
<a href="javascript:;" class="btn-emoji" title="克罗地亚"@click="emojiBtn('🇭🇷')">🇭🇷</a>
<a href="javascript:;" class="btn-emoji" title="海地"@click="emojiBtn('🇭🇹')">🇭🇹</a>
<a href="javascript:;" class="btn-emoji" title="匈牙利"@click="emojiBtn('🇭🇺')">🇭🇺</a>
<a href="javascript:;" class="btn-emoji" title="印尼"@click="emojiBtn('🇮🇩')">🇮🇩</a>
<a href="javascript:;" class="btn-emoji" title="爱尔兰"@click="emojiBtn('🇮🇪')">🇮🇪</a>
<a href="javascript:;" class="btn-emoji" title="以色列"@click="emojiBtn('🇮🇱')">🇮🇱</a>
<a href="javascript:;" class="btn-emoji" title="印度"@click="emojiBtn('🇮🇳')">🇮🇳</a>
<a href="javascript:;" class="btn-emoji" title="伊拉克共和国"@click="emojiBtn('🇮🇶')">🇮🇶</a>
<a href="javascript:;" class="btn-emoji" title="伊朗"@click="emojiBtn('🇮🇷')">🇮🇷</a>
<a href="javascript:;" class="btn-emoji" title="冰岛"@click="emojiBtn('🇮🇸')">🇮🇸</a>
<a href="javascript:;" class="btn-emoji" title="意大利"@click="emojiBtn('🇮🇹')">🇮🇹</a>
<a href="javascript:;" class="btn-emoji" title="牙买加"@click="emojiBtn('🇯🇲')">🇯🇲</a>
<a href="javascript:;" class="btn-emoji" title="日本"@click="emojiBtn('🇯🇵')">🇯🇵</a>
<a href="javascript:;" class="btn-emoji" title="肯尼亚"@click="emojiBtn('🇰🇪')">🇰🇪</a>
<a href="javascript:;" class="btn-emoji" title="吉尔吉斯斯坦"@click="emojiBtn('🇰🇬')">🇰🇬</a>
<a href="javascript:;" class="btn-emoji" title="柬埔寨"@click="emojiBtn('🇰🇭')">🇰🇭</a>
<a href="javascript:;" class="btn-emoji" title="基里巴斯共和国"@click="emojiBtn('🇰🇮')">🇰🇮</a>
<a href="javascript:;" class="btn-emoji" title="科摩罗伊斯兰联邦共和国"@click="emojiBtn('🇰🇲')">🇰🇲</a>
<a href="javascript:;" class="btn-emoji" title="圣基茨和尼维斯联邦"@click="emojiBtn('🇰🇳')">🇰🇳</a>
<a href="javascript:;" class="btn-emoji" title="北韩"@click="emojiBtn('🇰🇵')">🇰🇵</a>
<a href="javascript:;" class="btn-emoji" title="南韩"@click="emojiBtn('🇰🇷')">🇰🇷</a>
<a href="javascript:;" class="btn-emoji" title="科威特"@click="emojiBtn('🇰🇼')">🇰🇼</a>
<a href="javascript:;" class="btn-emoji" title="哈萨克斯坦共和国"@click="emojiBtn('🇰🇿')">🇰🇿</a>
<a href="javascript:;" class="btn-emoji" title="老挝人民民主共和国"@click="emojiBtn('🇱🇦')">🇱🇦</a>
<a href="javascript:;" class="btn-emoji" title="黎巴嫩"@click="emojiBtn('🇱🇧')">🇱🇧</a>
<a href="javascript:;" class="btn-emoji" title="圣卢西亚"@click="emojiBtn('🇱🇨')">🇱🇨</a>
<a href="javascript:;" class="btn-emoji" title="列支敦士登公国"@click="emojiBtn('🇱🇮')">🇱🇮</a>
<a href="javascript:;" class="btn-emoji" title="斯里兰卡民主社会主义共和国" @click="emojiBtn('🇱🇰')">🇱🇰</a>
<a href="javascript:;" class="btn-emoji" title="利比里亚" @click="emojiBtn('🇱🇷')">🇱🇷</a>
<a href="javascript:;" class="btn-emoji" title="莱索托王国" @click="emojiBtn('🇱🇸')">🇱🇸</a>
<a href="javascript:;" class="btn-emoji" title="立陶宛" @click="emojiBtn('🇱🇹')">🇱🇹</a>
<a href="javascript:;" class="btn-emoji" title="卢森堡公国" @click="emojiBtn('🇱🇺')">🇱🇺</a>
<a href="javascript:;" class="btn-emoji" title="拉脱维亚" @click="emojiBtn('🇱🇻')">🇱🇻</a>
<!-- <a href="javascript:;" class="btn-emoji" title="拉脱维亚" @click="emojiBtn('🍇')">🇱🇻</a> -->
<a href="javascript:;" class="btn-emoji" title="利比亚" @click="emojiBtn('🇱🇾')">🇱🇾</a>
<a href="javascript:;" class="btn-emoji" title="摩洛哥王国" @click="emojiBtn('🇲🇦')">🇲🇦</a>
<a href="javascript:;" class="btn-emoji" title="摩纳哥公国" @click="emojiBtn('🇲🇨')">🇲🇨</a>
<a href="javascript:;" class="btn-emoji" title="摩尔多瓦" @click="emojiBtn('🇲🇩')">🇲🇩</a>
<a href="javascript:;" class="btn-emoji" title="黑山" @click="emojiBtn('🇲🇪')">🇲🇪</a>
<a href="javascript:;" class="btn-emoji" title="马达加斯加" @click="emojiBtn('🇲🇬')">🇲🇬</a>
<a href="javascript:;" class="btn-emoji" title="马其顿共和国" @click="emojiBtn('🇲🇰')">🇲🇰</a>
<a href="javascript:;" class="btn-emoji" title="马里共和国" @click="emojiBtn('🇲🇱')">🇲🇱</a>
<a href="javascript:;" class="btn-emoji" title="缅甸" @click="emojiBtn('🇲🇲')">🇲🇲</a>
<a href="javascript:;" class="btn-emoji" title="外蒙古" @click="emojiBtn('🇲🇳')">🇲🇳</a>
<a href="javascript:;" class="btn-emoji" title="毛里塔尼亚伊斯兰共和国" @click="emojiBtn('🇲🇷')">🇲🇷</a>
<a href="javascript:;" class="btn-emoji" title="马耳他" @click="emojiBtn('🇲🇹')">🇲🇹</a>
<a href="javascript:;" class="btn-emoji" title="毛里求斯" @click="emojiBtn('🇲🇺')">🇲🇺</a>
<a href="javascript:;" class="btn-emoji" title="马尔代夫" @click="emojiBtn('🇲🇻')">🇲🇻</a>
<a href="javascript:;" class="btn-emoji" title="马拉维共和国" @click="emojiBtn('🇲🇼')">🇲🇼</a>
<a href="javascript:;" class="btn-emoji" title="墨西哥" @click="emojiBtn('🇲🇽')">🇲🇽</a>
<a href="javascript:;" class="btn-emoji" title="马来西亚" @click="emojiBtn('🇲🇾')">🇲🇾</a>
<a href="javascript:;" class="btn-emoji" title="莫桑比克毛纱罗" @click="emojiBtn('🇲🇿')">🇲🇿</a>
<a href="javascript:;" class="btn-emoji" title="纳米比亚" @click="emojiBtn('🇳🇦')">🇳🇦</a>
<a href="javascript:;" class="btn-emoji" title="尼日尔共和国" @click="emojiBtn('🇳🇪')">🇳🇪</a>
<a href="javascript:;" class="btn-emoji" title="尼日利亚" @click="emojiBtn('🇳🇬')">🇳🇬</a>
<a href="javascript:;" class="btn-emoji" title="尼加拉瓜" @click="emojiBtn('🇳🇮')">🇳🇮</a>
<a href="javascript:;" class="btn-emoji" title="荷兰" @click="emojiBtn('🇳🇱')">🇳🇱</a>
<a href="javascript:;" class="btn-emoji" title="挪威" @click="emojiBtn('🇳🇴')">🇳🇴</a>
<a href="javascript:;" class="btn-emoji" title="尼泊尔" @click="emojiBtn('🇳🇵')">🇳🇵</a>
<a href="javascript:;" class="btn-emoji" title="瑙鲁共和国" @click="emojiBtn('🇳🇷')">🇳🇷</a>
<a href="javascript:;" class="btn-emoji" title="新西兰" @click="emojiBtn('🇳🇿')">🇳🇿</a>
<a href="javascript:;" class="btn-emoji" title="阿曼苏丹国" @click="emojiBtn('🇴🇲')">🇴🇲</a>
<a href="javascript:;" class="btn-emoji" title="巴拿马共和国" @click="emojiBtn('🇵🇦')">🇵🇦</a>
<a href="javascript:;" class="btn-emoji" title="秘鲁共和国" @click="emojiBtn('🇵🇪')">🇵🇪</a>
<a href="javascript:;" class="btn-emoji" title="法国" @click="emojiBtn('🇵🇫')">🇵🇫</a>
<a href="javascript:;" class="btn-emoji" title="巴布亚新几内亚独立国" @click="emojiBtn('🇵🇬')">🇵🇬</a>
<a href="javascript:;" class="btn-emoji" title="巴基斯坦伊斯兰共和国" @click="emojiBtn('🇵🇰')">🇵🇰</a>
<a href="javascript:;" class="btn-emoji" title="波兰" @click="emojiBtn('🇵🇱')">🇵🇱</a>
<a href="javascript:;" class="btn-emoji" title="波多黎各自治邦" @click="emojiBtn('🇵🇷')">🇵🇷</a>
<a href="javascript:;" class="btn-emoji" title="葡萄牙" @click="emojiBtn('🇵🇹')">🇵🇹</a>
<a href="javascript:;" class="btn-emoji" title="帕劳共和国" @click="emojiBtn('🇵🇼')">🇵🇼</a>
<a href="javascript:;" class="btn-emoji" title="巴拉圭" @click="emojiBtn('🇵🇾')">🇵🇾</a>
<a href="javascript:;" class="btn-emoji" title="卡塔尔国" @click="emojiBtn('🇶🇦')">🇶🇦</a>
<a href="javascript:;" class="btn-emoji" title="罗马尼亚" @click="emojiBtn('🇷🇴')">🇷🇴</a>
<a href="javascript:;" class="btn-emoji" title="塞尔维亚" @click="emojiBtn('🇷🇸')">🇷🇸</a>
<a href="javascript:;" class="btn-emoji" title="俄罗斯" @click="emojiBtn('🇷🇺')">🇷🇺</a>
<a href="javascript:;" class="btn-emoji" title="卢旺达" @click="emojiBtn('🇷🇼')">🇷🇼</a>
<a href="javascript:;" class="btn-emoji" title="沙特阿拉伯" @click="emojiBtn('🇸🇦')">🇸🇦</a>
<a href="javascript:;" class="btn-emoji" title="塞舌尔共和国" @click="emojiBtn('🇸🇨')">🇸🇨</a>
<a href="javascript:;" class="btn-emoji" title="苏丹" @click="emojiBtn('🇸🇩')">🇸🇩</a>
<a href="javascript:;" class="btn-emoji" title="瑞典" @click="emojiBtn('🇸🇪')">🇸🇪</a>
<a href="javascript:;" class="btn-emoji" title="新加坡" @click="emojiBtn('🇸🇬')">🇸🇬</a>
<a href="javascript:;" class="btn-emoji" title="斯洛文尼亚共和国" @click="emojiBtn('🇸🇮')">🇸🇮</a>
<a href="javascript:;" class="btn-emoji" title="斯洛伐克共和国" @click="emojiBtn('🇸🇰')">🇸🇰</a>
<a href="javascript:;" class="btn-emoji" title="塞拉利昂共和国" @click="emojiBtn('🇸🇱')">🇸🇱</a>
<a href="javascript:;" class="btn-emoji" title="圣马力诺共和国" @click="emojiBtn('🇸🇲')">🇸🇲</a>
<a href="javascript:;" class="btn-emoji" title="塞内加尔共和国" @click="emojiBtn('🇸🇳')">🇸🇳</a>
<a href="javascript:;" class="btn-emoji" title="苏里南共和国" @click="emojiBtn('🇸🇷')">🇸🇷</a>
<a href="javascript:;" class="btn-emoji" title="萨尔瓦多共和国" @click="emojiBtn('🇸🇻')">🇸🇻</a>
<a href="javascript:;" class="btn-emoji" title="叙利亚" @click="emojiBtn('🇸🇾')">🇸🇾</a>
<a href="javascript:;" class="btn-emoji" title="瑞士" @click="emojiBtn('🇸🇿')">🇸🇿</a>
<a href="javascript:;" class="btn-emoji" title="多哥共和国" @click="emojiBtn('🇹🇬')">🇹🇬</a>
<a href="javascript:;" class="btn-emoji" title="泰国" @click="emojiBtn('🇹🇭')">🇹🇭</a>
<a href="javascript:;" class="btn-emoji" title="塔吉克斯坦共和国" @click="emojiBtn('🇹🇯')">🇹🇯</a>
<a href="javascript:;" class="btn-emoji" title="东帝汶民主共和国" @click="emojiBtn('🇹🇱')">🇹🇱</a>
<a href="javascript:;" class="btn-emoji" title="土库曼斯坦" @click="emojiBtn('🇹🇲')">🇹🇲</a>
<a href="javascript:;" class="btn-emoji" title="突尼斯共和国" @click="emojiBtn('🇹🇳')">🇹🇳</a>
<a href="javascript:;" class="btn-emoji" title="汤加" @click="emojiBtn('🇹🇴')">🇹🇴</a>
<a href="javascript:;" class="btn-emoji" title="土耳其" @click="emojiBtn('🇹🇷')">🇹🇷</a>
<a href="javascript:;" class="btn-emoji" title="特立尼达和多巴哥" @click="emojiBtn('🇹🇹')">🇹🇹</a>
<a href="javascript:;" class="btn-emoji" title="图瓦卢" @click="emojiBtn('🇹🇻')">🇹🇻</a>
<a href="javascript:;" class="btn-emoji" title="坦桑尼亚联合共和国" @click="emojiBtn('🇹🇿')">🇹🇿</a>
<a href="javascript:;" class="btn-emoji" title="乌克兰" @click="emojiBtn('🇺🇦')">🇺🇦</a>
<a href="javascript:;" class="btn-emoji" title="乌干达" @click="emojiBtn('🇺🇬')">🇺🇬</a>
<a href="javascript:;" class="btn-emoji" title="美国" @click="emojiBtn('🇺🇸')">🇺🇸</a>
<a href="javascript:;" class="btn-emoji" title="乌拉圭东岸共和国" @click="emojiBtn('🇺🇾')">🇺🇾</a>
<a href="javascript:;" class="btn-emoji" title="乌兹别克斯坦" @click="emojiBtn('🇺🇿')">🇺🇿</a>
<a href="javascript:;" class="btn-emoji" title="梵蒂冈" @click="emojiBtn('🇻🇦')">🇻🇦</a>
<a href="javascript:;" class="btn-emoji" title="委内瑞拉玻利瓦尔共和国" @click="emojiBtn('🇻🇪')">🇻🇪</a>
<a href="javascript:;" class="btn-emoji" title="越南" @click="emojiBtn('🇻🇺')">🇻🇺</a>
<a href="javascript:;" class="btn-emoji" title="也门" @click="emojiBtn('🇾🇪')">🇾🇪</a>
<a href="javascript:;" class="btn-emoji" title="南非" @click="emojiBtn('🇿🇦')">🇿🇦</a>
<a href="javascript:;" class="btn-emoji" title="津巴布韦共和国" @click="emojiBtn('🇿🇼')">🇿🇼</a>
</div>
</el-tab-pane>
<el-tab-pane label="符号" name="symbol">
<div class="flex-start-start w-100p flex-wrap-wrap flex-wrap-wrap emojiItem">
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('💘')">💘</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('❤')">❤</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('💓')">💓</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('💔')">💔</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('💕')">💕</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('💖')">💖</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('💗')">💗</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('💙')">💙</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('💚')">💚</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('💛')">💛</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('💜')">💜</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🖤')">🖤</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('💝')">💝</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('💞')">💞</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('💟')">💟</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('💤')">💤</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('💢')">💢</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('💬')">💬</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🗨')">🗨</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🗯')">🗯</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('💭')">💭</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('💮')">💮</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('♨')">♨</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('💈')">💈</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🛑')">🛑</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🕛')">🕛</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🕐')">🕐</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🕑')">🕑</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🕒')">🕒</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🕓')">🕓</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🕕')">🕕</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🕖')">🕖</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🕘')">🕘</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🕙')">🕙</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🕚')">🕚</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🌀')">🌀</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('♠')">♠</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('♥')">♥</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('♦')">♦</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('♣')">♣</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🃏')">🃏</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🀄')">🀄</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('📢')">📢</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🎵')">🎵</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('❓')">❓</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('❗')">❗</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('️⃣')">#️⃣</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('️⃣')">*️⃣</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('0️⃣')">0️⃣</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('1️⃣')">1️⃣</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('2️⃣')">2️⃣</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('3️⃣')">3️⃣</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('4️⃣')">4️⃣</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('5️⃣')">5️⃣</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('6️⃣')">6️⃣</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('7️⃣')">7️⃣</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('8️⃣')">8️⃣</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('9️⃣')">9️⃣</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🔟')">🔟</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('💯')">💯</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('⬆')">⬆</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('↗')">↗</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('➡')">➡</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('↘')">↘</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('⬇')">⬇</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('↙')">↙</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('⬅')">⬅</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('↖')">↖</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('↕')">↕</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('↔')">↔</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('↩')">↩</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('↪')">↪</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🆔')">🆔</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🈷')">🈷</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🈶')">🈶</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🈯')">🈯</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🉐')">🉐</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🈹')">🈹</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🈚')">🈚</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🉑')">🉑</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🈸')">🈸</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🈳')">🈳</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🈺')">🈺</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🈵')">🈵</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('㊗')">㊗</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('㊙')">㊙</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🔶')">🔶</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🔷')">🔷</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🔺')">🔺</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🔻')">🔻</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('⚪')">⚪</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('⚫')">⚫</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🔴')">🔴</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🔵')">🔵</a>
</div>
</el-tab-pane>
<el-tab-pane label="场景" name="scene">
<div class="flex-start-start w-100p flex-wrap-wrap flex-wrap-wrap emojiItem">
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🚣')">🚣</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🏎')">🏎</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🏍')">🏍</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🗾')">🗾</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🏔')">🏔</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('⛰')">⛰</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🌋')">🌋</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🗻')">🗻</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🏕')">🏕</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🏖')">🏖</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🏜')">🏜</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🏝')">🏝</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🏞')">🏞</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🏟')">🏟</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🏛')">🏛</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🏗')">🏗</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🏘')">🏘</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🏚')">🏚</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🏠')">🏠</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🏡')">🏡</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🏢')">🏢</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🏣')">🏣</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🏤')">🏤</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🏥')">🏥</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🏦')">🏦</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🏨')">🏨</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🏩')">🏩</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🏪')">🏪</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🏫')">🏫</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🏬')">🏬</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🏭')">🏭</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🏯')">🏯</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🏰')">🏰</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('💒')">💒</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🗼')">🗼</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🗽')">🗽</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('⛪')">⛪</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🕌')">🕌</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🕍')">🕍</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('⛩')">⛩</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🕋')">🕋</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('⛲')">⛲</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('⛺')">⛺</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🌁')">🌁</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🌃')">🌃</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🏙')">🏙</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🌄')">🌄</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🌅')">🌅</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🌆')">🌆</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🌇')">🌇</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🌉')">🌉</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🌌')">🌌</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🎠')">🎠</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🎡')">🎡</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🎢')">🎢</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🚂')">🚂</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🚃')">🚃</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🚄')">🚄</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🚅')">🚅</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🚆')">🚆</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🚇')">🚇</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🚈')">🚈</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🚉')">🚉</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🚊')">🚊</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🚝')">🚝</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🚞')">🚞</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🚋')">🚋</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🚌')">🚌</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🚍')">🚍</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🚎')">🚎</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🚐')">🚐</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🚑')">🚑</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🚒')">🚒</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🚓')">🚓</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🚔')">🚔</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🚕')">🚕</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🚖')">🚖</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🚗')">🚗</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🚚')">🚚</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🚜')">🚜</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🚲')">🚲</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🛵')">🛵</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🛣')">🛣</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🛤')">🛤</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('⛽')">⛽</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🚨')">🚨</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🚥')">🚥</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🚦')">🚦</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🚧')">🚧</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('⚓')">⚓</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('⛵')">⛵</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🛶')">🛶</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🚤')">🚤</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🛳')">🛳</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('⛴')">⛴</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🛥')">🛥</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🚢')">🚢</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('✈')">✈</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🛩')">🛩</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🛫')">🛫</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🛬')">🛬</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('💺')">💺</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🚁')">🚁</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🚟')">🚟</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🚠')">🚠</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🚡')">🚡</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🛰')">🛰</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🚀')">🚀</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🌠')">🌠</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🎆')">🎆</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🎇')">🎇</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🎑')">🎑</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🛂')">🛂</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🛃')">🛃</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🛄')">🛄</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🛅')">🛅</a>
</div>
</el-tab-pane>
<el-tab-pane label="饮食" name="diet">
<div class="flex-start-start w-100p flex-wrap-wrap flex-wrap-wrap emojiItem">
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🍇')">🍇</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🍈')">🍈</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🍉')">🍉</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🍊')">🍊</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🍋')">🍋</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🍌')">🍌</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🍍')">🍍</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🍎')">🍎</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🍏')">🍏</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🍐')">🍐</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🍑')">🍑</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🍒')">🍒</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🍓')">🍓</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🥝')">🥝</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🍅')">🍅</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🥑')">🥑</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🍆')">🍆</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🥔')">🥔</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🥕')">🥕</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🌽')">🌽</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🌶')">🌶</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🥒')">🥒</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🍄')">🍄</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🥜')">🥜</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🌰')">🌰</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🍞')">🍞</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🥐')">🥐</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🥖')">🥖</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🥞')">🥞</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🧀')">🧀</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🍖')">🍖</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🍗')">🍗</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🥓')">🥓</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🍔')">🍔</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🍟')">🍟</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🍕')">🍕</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🌭')">🌭</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🌮')">🌮</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🌯')">🌯</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🥙')">🥙</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🥚')">🥚</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🍳')">🍳</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🥘')">🥘</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🍲')">🍲</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🥗')">🥗</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🍿')">🍿</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🍱')">🍱</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🍘')">🍘</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🍙')">🍙</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🍚')">🍚</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🍛')">🍛</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🍜')">🍜</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🍝')">🍝</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🍠')">🍠</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🍢')">🍢</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🍣')">🍣</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🍤')">🍤</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🍥')">🍥</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🍡')">🍡</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🍦')">🍦</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🍧')">🍧</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🍨')">🍨</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🍩')">🍩</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🍪')">🍪</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🎂')">🎂</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🍰')">🍰</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🍫')">🍫</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🍬')">🍬</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🍭')">🍭</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🍮')">🍮</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🍯')">🍯</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🍼')">🍼</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🥛')">🥛</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('☕')">☕</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🍶')">🍶</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🍾')">🍾</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🍷')">🍷</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🍸')">🍸</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🍹')">🍹</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🍺')">🍺</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🍻')">🍻</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🥂')">🥂</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🥃')">🥃</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🍽')">🍽</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🍴')">🍴</a>
<a href="javascript:;" class="btn-emoji" @click="emojiBtn('🥄')">🥄</a>
</div>
</el-tab-pane>
</el-tabs>
</template>
</div>
</div>
</div>
</template>
<script>
import {twemoji} from 'http://twemoji.maxcdn.com/2/twemoji.min.js'
export default {
data() {
return {
shareText:''
}
},
mounted() {
var emojilist = document.querySelector('.emojilist')
twemoji.parse(emojilist, {"size":72});
},
methods: {
emojiTabsCheckBtn () {},
/** #TODO emoji tab 切换 */
emojiBtn(e) {
this.shareText = this.shareText + e
var tx = document.querySelector('.shareText .el-textarea__inner');
var pos = this.cursorPositionGet(tx);
},
cursorPositionGet (textarea) {
var rangeData = { text: "", start: 0, end: 0 };
if (textarea.setSelectionRange) { // W3C
textarea.focus();
rangeData.start = textarea.selectionStart;
rangeData.end = textarea.selectionEnd;
rangeData.text = (rangeData.start != rangeData.end) ? textarea.value.substring(rangeData.start, rangeData.end) : "";
} else if (document.selection) { // IE
textarea.focus();
var i,
oS = document.selection.createRange(),
oR = document.body.createTextRange();
oR.moveToElementText(textarea);
rangeData.text = oS.text;
rangeData.bookmark = oS.getBookmark();
for (i = 0; oR.compareEndPoints('StartToStart', oS) < 0 && oS.moveStart("character", -1) !== 0; i++) {
if (textarea.value.charAt(i) == '\r') {
i++;
}
}
rangeData.start = i;
rangeData.end = rangeData.text.length + rangeData.start;
}
return rangeData;
},
},
}
</script>
注意:
千万记得初始化