vue中使用微信聊天表情
1、先準備好表情數據,新建emjoydata.js文件。
export const emojisAmap = {
"微笑": "emojis_0",
"撇嘴": "emojis_1",
"色": "emojis_2",
"發呆": "emojis_3",
"得意": "emojis_4",
"流淚": "emojis_5",
"害羞": "emojis_6",
"閉嘴": "emojis_7",
"睡": "emojis_8",
"大哭": "emojis_9",
"尷尬": "emojis_10",
"發怒": "emojis_11",
"調皮": "emojis_12",
"呲牙": "emojis_13",
"驚訝": "emojis_14",
"難過": "emojis_15",
"酷": "emojis_16",
"囧": "emojis_17",
"抓狂": "emojis_18",
"吐": "emojis_19",
"偷笑": "emojis_20",
"愉快": "emojis_21",
"白眼": "emojis_22",
"傲慢": "emojis_23",
"飢餓": "emojis_24",
"困": "emojis_25",
"驚恐": "emojis_26",
"流汗": "emojis_27",
"憨笑": "emojis_28",
"悠閒": "emojis_29",
"奮鬥": "emojis_30",
"咒罵": "emojis_31",
"疑問": "emojis_32",
"噓": "emojis_33",
"暈": "emojis_34",
"瘋了": "emojis_35",
"衰": "emojis_36",
"骷髏": "emojis_37",
"敲打": "emojis_38",
"再見": "emojis_39",
"擦汗": "emojis_40",
"摳鼻": "emojis_41",
"鼓掌": "emojis_42",
"糗大了": "emojis_43",
"壞笑": "emojis_44",
"左哼哼": "emojis_45",
"右哼哼": "emojis_46",
"哈欠": "emojis_47",
"鄙視": "emojis_48",
"委屈": "emojis_49",
"快哭了": "emojis_50",
"陰險": "emojis_51",
"親親": "emojis_52",
"嚇": "emojis_53",
"可憐": "emojis_54",
"菜刀": "emojis_55",
"西瓜": "emojis_56",
"啤酒": "emojis_57",
"籃球": "emojis_58",
"乒乓": "emojis_59",
"咖啡": "emojis_60",
"飯": "emojis_61",
"豬頭": "emojis_62",
"玫瑰": "emojis_63",
"凋謝": "emojis_64",
"嘴脣": "emojis_65",
"愛心": "emojis_66",
"心碎": "emojis_67",
"蛋糕": "emojis_68",
"閃電": "emojis_69",
"炸彈": "emojis_70",
"刀": "emojis_71",
"足球": "emojis_72",
"瓢蟲": "emojis_73",
"便便": "emojis_74",
"月亮": "emojis_75",
"太陽": "emojis_76",
"禮物": "emojis_77",
"擁抱": "emojis_78",
"強": "emojis_79",
"弱": "emojis_80",
"握手": "emojis_81",
"勝利": "emojis_82",
"抱拳": "emojis_83",
"勾引": "emojis_84",
"拳頭": "emojis_85",
"差勁": "emojis_86",
"愛你": "emojis_87",
"NO": "emojis_88",
"OK": "emojis_89",
"愛情": "emojis_90",
"飛吻": "emojis_91",
"跳跳": "emojis_92",
"發抖": "emojis_93",
"慪火": "emojis_94",
"轉圈": "emojis_95",
"磕頭": "emojis_96",
"回頭": "emojis_97",
"跳繩": "emojis_98",
"右太極": "emojis_104",
"激動": "emojis_100",
"亂舞": "emojis_101",
"獻吻": "emojis_102",
"左太極": "emojis_103",
"投降": "emojis_99"
};
export const emojisBmap = {
"😁": "emojib_0",
"😷": "emojib_1",
"😂": "emojib_2",
"😝": "emojib_3",
"😳": "emojib_4",
"😱": "emojib_5",
"😔": "emojib_6",
"😒": "emojib_7",
"[嘿哈]": "emojib_8",
"[捂臉]": "emojib_9",
"[奸笑]": "emojib_10",
"[機智]": "emojib_11",
"[皺眉]": "emojib_12",
"[耶]": "emojib_13",
"👻": "emojib_14",
"🙏": "emojib_15",
"💪": "emojib_16",
"🎉": "emojib_17",
"🎁": "emojib_18",
"[紅包]": "emojib_19",
"[雞]": "emojib_101",
"😊": "emojib_21",
"😃": "emojib_22",
"☺": "emojib_23",
"😉": "emojib_24",
"😍": "emojib_25",
"😘": "emojib_26",
"😚": "emojib_27",
"😬": "emojib_28",
"😌": "emojib_29",
"😜": "emojib_30",
"😏": "emojib_31",
"😓": "emojib_32",
"😞": "emojib_33",
"😖": "emojib_34",
"😢": "emojib_39",
"😰": "emojib_36",
"😨": "emojib_37",
"😣": "emojib_38",
"😭": "emojib_40",
"😵": "emojib_41",
"😠": "emojib_42",
"😡": "emojib_43",
"😪": "emojib_44",
"👿": "emojib_45",
"👽": "emojib_46",
"❤": "emojib_47",
"💔": "emojib_48",
"💘": "emojib_49",
"✨": "emojib_50",
"⭐": "emojib_51",
"❗": "emojib_52",
"❓": "emojib_53",
"💤": "emojib_54",
"💦": "emojib_55",
"🎵": "emojib_56",
"🔥": "emojib_57",
"💩": "emojib_58",
"👍": "emojib_59",
"👎": "emojib_60",
"👊": "emojib_61",
"✌": "emojib_62",
"👆": "emojib_63",
"👇": "emojib_64",
"👉": "emojib_65",
"👈": "emojib_66",
"☝": "emojib_67",
"💏": "emojib_68",
"💑": "emojib_69",
"👦": "emojib_70",
"👧": "emojib_71",
"👩": "emojib_72",
"👨": "emojib_73",
"👼": "emojib_74",
"💀": "emojib_75",
"💋": "emojib_76",
"☀": "emojib_77",
"☔": "emojib_78",
"☁": "emojib_79",
"⛄": "emojib_80",
"🌙": "emojib_81",
"⚡": "emojib_82",
"🌊": "emojib_83",
"🐱": "emojib_84",
"🐶": "emojib_85",
"🐭": "emojib_86",
"🐹": "emojib_87",
"🐰": "emojib_88",
"🐺": "emojib_89",
"🐸": "emojib_90",
"🐯": "emojib_91",
"🐨": "emojib_92",
"🐻": "emojib_93",
"🐷": "emojib_94",
"🐮": "emojib_95",
"🐗": "emojib_96",
"🐵": "emojib_97",
"🐴": "emojib_98",
"🐍": "emojib_99",
"🐦": "emojib_100",
"🐧": "emojib_102",
"🐛": "emojib_103",
"🐙": "emojib_104",
"🐠": "emojib_105",
"🐳": "emojib_106",
"🐬": "emojib_107",
"🌹": "emojib_108",
"🌺": "emojib_109",
"🌴": "emojib_110",
"🌵": "emojib_111",
"💝": "emojib_112",
"🎃": "emojib_113",
"🎅": "emojib_114",
"🎄": "emojib_115",
"🔔": "emojib_116",
"🎈": "emojib_117",
"💿": "emojib_118",
"📷": "emojib_119",
"🎥": "emojib_120",
"💻": "emojib_121",
"📺": "emojib_122",
"☎": "emojib_123",
"🔓": "emojib_124",
"🔒": "emojib_125",
"🔑": "emojib_126",
"🔨": "emojib_127",
"💡": "emojib_128",
"📫": "emojib_129",
"🛀": "emojib_130",
"💰": "emojib_131",
"💣": "emojib_132",
"🔫": "emojib_133",
"💊": "emojib_134",
"🏈": "emojib_135",
"🏀": "emojib_136",
"⚽": "emojib_137",
"⚾": "emojib_138",
"⛳": "emojib_139",
"🏆": "emojib_140",
"👾": "emojib_141",
"🎤": "emojib_142",
"🎸": "emojib_143",
"👙": "emojib_144",
"👑": "emojib_145",
"🌂": "emojib_146",
"👜": "emojib_147",
"💄": "emojib_148",
"💍": "emojib_149",
"💎": "emojib_150",
"☕": "emojib_151",
"🍺": "emojib_152",
"🍻": "emojib_153",
"🍸": "emojib_154",
"🍔": "emojib_155",
"🍟": "emojib_156",
"🍝": "emojib_157",
"🍣": "emojib_158",
"🍜": "emojib_159",
"🍳": "emojib_160",
"🍦": "emojib_161",
"🎂": "emojib_162",
"🍅": "emojib_163",
"✈": "emojib_164",
"🚀": "emojib_165",
"🚲": "emojib_166",
"🚄": "emojib_167",
"⚠": "emojib_168",
"🏁": "emojib_169",
"🚹": "emojib_170",
"🚺": "emojib_171",
"⭕": "emojib_172",
"✖": "emojib_173",
"©": "emojib_174",
"®": "emojib_175",
"™": "emojib_176",
"[發]": "emojib_177",
"[小狗]": "emojib_85"
}
export const emojiReg = /\ud83d\ude01|\ud83d\ude37|\ud83d\ude02|\ud83d\ude1d|\ud83d\ude33|\ud83d\ude31|\ud83d\ude14|\ud83d\ude12|\ud83d\udc7b|\ud83d\ude4f|\ud83d\udcaa|\ud83c\udf89|\ud83c\udf81|\ud83d\ude0a|\ud83d\ude03|\u263a|\ud83d\ude09|\ud83d\ude0d|\ud83d\ude18|\ud83d\ude1a|\ud83d\ude2c|\ud83d\ude0c|\ud83d\ude1c|\ud83d\ude0f|\ud83d\ude13|\ud83d\ude1e|\ud83d\ude16|\ud83d\ude22|\ud83d\ude30|\ud83d\ude28|\ud83d\ude23|\ud83d\ude2d|\ud83d\ude35|\ud83d\ude20|\ud83d\ude21|\ud83d\ude2a|\ud83d\udc7f|\ud83d\udc7d|\u2764|\ud83d\udc94|\ud83d\udc98|\u2728|\u2b50|\u2757|\u2753|\ud83d\udca4|\ud83d\udca6|\ud83c\udfb5|\ud83d\udd25|\ud83d\udca9|\ud83d\udc4d|\ud83d\udc4e|\ud83d\udc4a|\u270c|\ud83d\udc46|\ud83d\udc47|\ud83d\udc49|\ud83d\udc48|\u261d|\ud83d\udc8f|\ud83d\udc91|\ud83d\udc66|\ud83d\udc67|\ud83d\udc69|\ud83d\udc68|\ud83d\udc7c|\ud83d\udc80|\ud83d\udc8b|\u2600|\u2614|\u2601|\u26c4|\ud83c\udf19|\u26a1|\ud83c\udf0a|\ud83d\udc31|\ud83d\udc36|\ud83d\udc2d|\ud83d\udc39|\ud83d\udc30|\ud83d\udc3a|\ud83d\udc38|\ud83d\udc2f|\ud83d\udc28|\ud83d\udc3b|\ud83d\udc37|\ud83d\udc2e|\ud83d\udc17|\ud83d\udc35|\ud83d\udc34|\ud83d\udc0d|\ud83d\udc26|\ud83d\udc27|\ud83d\udc1b|\ud83d\udc19|\ud83d\udc20|\ud83d\udc33|\ud83d\udc2c|\ud83c\udf39|\ud83c\udf3a|\ud83c\udf34|\ud83c\udf35|\ud83d\udc9d|\ud83c\udf83|\ud83c\udf85|\ud83c\udf84|\ud83d\udd14|\ud83c\udf88|\ud83d\udcbf|\ud83d\udcf7|\ud83c\udfa5|\ud83d\udcbb|\ud83d\udcfa|\u260e|\ud83d\udd13|\ud83d\udd12|\ud83d\udd11|\ud83d\udd28|\ud83d\udca1|\ud83d\udceb|\ud83d\udec0|\ud83d\udcb0|\ud83d\udca3|\ud83d\udd2b|\ud83d\udc8a|\ud83c\udfc8|\ud83c\udfc0|\u26bd|\u26be|\u26f3|\ud83c\udfc6|\ud83d\udc7e|\ud83c\udfa4|\ud83c\udfb8|\ud83d\udc59|\ud83d\udc51|\ud83c\udf02|\ud83d\udc5c|\ud83d\udc84|\ud83d\udc8d|\ud83d\udc8e|\u2615|\ud83c\udf7a|\ud83c\udf7b|\ud83c\udf78|\ud83c\udf54|\ud83c\udf5f|\ud83c\udf5d|\ud83c\udf63|\ud83c\udf5c|\ud83c\udf73|\ud83c\udf66|\ud83c\udf82|\ud83c\udf45|\u2708|\ud83d\ude80|\ud83d\udeb2|\ud83d\ude84|\u26a0|\ud83c\udfc1|\ud83d\udeb9|\ud83d\udeba|\u2b55|\u2716|\u0026\u0023\u0031\u0036\u0039\u003b|\u0026\u0023\u0031\u0037\u0034\u003b|\u2122/g;
export const emojiString = "嘿哈,捂臉,奸笑,機智,皺眉,耶,紅包,雞,發,小狗";
export const wChartReg = /\uE415|\uE40C|\uE412|\uE409|\uE40D|\uE107|\uE403|\uE40E|\uE11B|\uE14C|\uE312|\uE112|\uE056|\uE057|\uE414|\uE405|\uE106|\uE418|\uE417|\uE404|\uE40A|\uE105|\uE402|\uE108|\uE058|\uE407|\uE401|\uE40F|\uE40B|\uE406|\uE413|\uE411|\uE410|\uE059|\uE416|\uE408|\uE11A|\uE10C|\uE022|\uE023|\uE329|\uE32E|\uE335|\uE337|\uE336|\uE13C|\uE331|\uE03E|\uE11D|\uE05A|\uE00E|\uE421|\uE00D|\uE011|\uE22E|\uE22F|\uE231|\uE230|\uE00F|\uE111|\uE425|\uE001|\uE002|\uE005|\uE004|\uE04E|\uE11C|\uE003|\uE04A|\uE04B|\uE049|\uE048|\uE04C|\uE13D|\uE43E|\uE04F|\uE052|\uE053|\uE524|\uE52C|\uE52A|\uE531|\uE050|\uE527|\uE051|\uE10B|\uE52B|\uE52F|\uE109|\uE01A|\uE52D|\uE521|\uE52E|\uE055|\uE525|\uE10A|\uE522|\uE054|\uE520|\uE032|\uE303|\uE307|\uE308|\uE437|\uE445|\uE448|\uE033|\uE325|\uE310|\uE126|\uE008|\uE03D|\uE00C|\uE12A|\uE009|\uE145|\uE144|\uE03F|\uE116|\uE10F|\uE101|\uE13F|\uE12F|\uE311|\uE113|\uE30F|\uE42B|\uE42A|\uE018|\uE016|\uE014|\uE131|\uE12B|\uE03C|\uE041|\uE322|\uE10E|\uE43C|\uE323|\uE31C|\uE034|\uE035|\uE045|\uE30C|\uE044|\uE120|\uE33B|\uE33F|\uE344|\uE340|\uE147|\uE33A|\uE34B|\uE345|\uE01D|\uE10D|\uE136|\uE435|\uE252|\uE132|\uE138|\uE139|\uE332|\uE333|\uE24E|\uE24F|\uE537|\uE41D/g;
export const wChatEmojis = {
"E415": "emojib_0",
"E40C": "emojib_1",
"E412": "emojib_2",
"E409": "emojib_3",
"E40D": "emojib_4",
"E107": "emojib_5",
"E403": "emojib_6",
"E40E": "emojib_7",
"[嘿哈]": "emojib_8",
"[捂臉]": "emojib_9",
"[奸笑]": "emojib_10",
"[機智]": "emojib_11",
"[皺眉]": "emojib_12",
"[耶]": "emojib_13",
"E11B": "emojib_14",
"E41D": "emojib_15",
"E14C": "emojib_16",
"E312": "emojib_17",
"E112": "emojib_18",
"[紅包]": "emojib_19",
"[雞]": "emojib_101",
"E056": "emojib_21",
"E057": "emojib_22",
"E414": "emojib_23",
"E405": "emojib_24",
"E106": "emojib_25",
"E418": "emojib_26",
"E417": "emojib_27",
"E404": "emojib_28",
"E40A": "emojib_29",
"E105": "emojib_30",
"E402": "emojib_31",
"E108": "emojib_32",
"E058": "emojib_33",
"E407": "emojib_34",
"E401": "emojib_35",
"E40F": "emojib_36",
"E40B": "emojib_37",
"E406": "emojib_38",
"E413": "emojib_39",
"E411": "emojib_40",
"E410": "emojib_41",
"E059": "emojib_42",
"E416": "emojib_43",
"E408": "emojib_44",
"E11A": "emojib_45",
"E10C": "emojib_46",
"E022": "emojib_47",
"E023": "emojib_48",
"E329": "emojib_49",
"E32E": "emojib_50",
"E335": "emojib_51",
"E337": "emojib_52",
"E336": "emojib_53",
"E13C": "emojib_54",
"E331": "emojib_55",
"E03E": "emojib_56",
"E11D": "emojib_57",
"E05A": "emojib_58",
"E00E": "emojib_59",
"E421": "emojib_60",
"E00D": "emojib_61",
"E011": "emojib_62",
"E22E": "emojib_63",
"E22F": "emojib_64",
"E231": "emojib_65",
"E230": "emojib_66",
"E00F": "emojib_67",
"E111": "emojib_68",
"E425": "emojib_69",
"E001": "emojib_70",
"E002": "emojib_71",
"E005": "emojib_72",
"E004": "emojib_73",
"E04E": "emojib_74",
"E11C": "emojib_75",
"E003": "emojib_76",
"E04A": "emojib_77",
"E04B": "emojib_78",
"E049": "emojib_79",
"E048": "emojib_80",
"E04C": "emojib_81",
"E13D": "emojib_82",
"E43E": "emojib_83",
"E04F": "emojib_84",
"E052": "emojib_85",
"E053": "emojib_86",
"E524": "emojib_87",
"E52C": "emojib_88",
"E52A": "emojib_89",
"E531": "emojib_90",
"E050": "emojib_91",
"E527": "emojib_92",
"E051": "emojib_93",
"E10B": "emojib_94",
"E52B": "emojib_95",
"E52F": "emojib_96",
"E109": "emojib_97",
"E01A": "emojib_98",
"E52D": "emojib_99",
"E521": "emojib_100",
"E52E": "emojib_101",
"E055": "emojib_102",
"E525": "emojib_103",
"E10A": "emojib_104",
"E522": "emojib_105",
"E054": "emojib_106",
"E520": "emojib_107",
"E032": "emojib_108",
"E303": "emojib_109",
"E307": "emojib_110",
"E308": "emojib_111",
"E437": "emojib_112",
"E445": "emojib_113",
"E448": "emojib_114",
"E033": "emojib_115",
"E325": "emojib_116",
"E310": "emojib_117",
"E126": "emojib_118",
"E008": "emojib_119",
"E03D": "emojib_120",
"E00C": "emojib_121",
"E12A": "emojib_122",
"E009": "emojib_123",
"E145": "emojib_124",
"E144": "emojib_125",
"E03F": "emojib_126",
"E116": "emojib_127",
"E10F": "emojib_128",
"E101": "emojib_129",
"E13F": "emojib_130",
"E12F": "emojib_131",
"E311": "emojib_132",
"E113": "emojib_133",
"E30F": "emojib_134",
"E42B": "emojib_135",
"E42A": "emojib_136",
"E018": "emojib_137",
"E016": "emojib_138",
"E014": "emojib_139",
"E131": "emojib_140",
"E12B": "emojib_141",
"E03C": "emojib_142",
"E041": "emojib_143",
"E322": "emojib_144",
"E10E": "emojib_145",
"E43C": "emojib_146",
"E323": "emojib_147",
"E31C": "emojib_148",
"E034": "emojib_149",
"E035": "emojib_150",
"E045": "emojib_151",
"E047": "emojib_152",
"E30C": "emojib_153",
"E044": "emojib_154",
"E120": "emojib_155",
"E33B": "emojib_156",
"E33F": "emojib_157",
"E344": "emojib_158",
"E340": "emojib_159",
"E147": "emojib_160",
"E33A": "emojib_161",
"E34B": "emojib_162",
"E345": "emojib_163",
"E01D": "emojib_164",
"E10D": "emojib_165",
"E136": "emojib_166",
"E435": "emojib_167",
"E252": "emojib_168",
"E132": "emojib_169",
"E138": "emojib_170",
"E139": "emojib_171",
"E332": "emojib_172",
"E333": "emojib_173",
"E24E": "emojib_174",
"E24F": "emojib_175",
"E537": "emojib_176",
"[發]": "emojib_177",
"[小狗]": "emojib_85"
}
export const wChatToUi = {
"E415": "😁",
"E40C": "😷",
"E412": "😂",
"E409": "😝",
"E40D": "😳",
"E107": "😱",
"E403": "😔",
"E40E": "😒",
"[嘿哈]": "[嘿哈]",
"[捂臉]": "[捂臉]",
"[奸笑]": "[奸笑]",
"[機智]": "[機智]",
"[皺眉]": "[皺眉]",
"[耶]": "[耶]",
"E11B": "👻",
"E41D": "🙏",
"E14C": "💪",
"E312": "🎉",
"E112": "🎁",
"[紅包]": "[紅包]",
"[雞]": "[雞]",
"E056": "😊",
"E057": "😃",
"E414": "☺",
"E405": "😉",
"E106": "😍",
"E418": "😘",
"E417": "😚",
"E404": "😬",
"E40A": "😌",
"E105": "😜",
"E402": "😏",
"E108": "😓",
"E058": "😞",
"E407": "😖",
"E401": "😢",
"E40F": "😰",
"E40B": "😨",
"E406": "😣",
"E413": "😢",
"E411": "😭",
"E410": "😵",
"E059": "😠",
"E416": "😡",
"E408": "😪",
"E11A": "👿",
"E10C": "👽",
"E022": "❤",
"E023": "💔",
"E329": "💘",
"E32E": "✨",
"E335": "⭐",
"E337": "❗",
"E336": "❓",
"E13C": "💤",
"E331": "💦",
"E03E": "🎵",
"E11D": "🔥",
"E05A": "💩",
"E00E": "👍",
"E421": "👎",
"E00D": "👊",
"E011": "✌",
"E22E": "👆",
"E22F": "👇",
"E231": "👉",
"E230": "👈",
"E00F": "☝",
"E111": "💏",
"E425": "💑",
"E001": "👦",
"E002": "👧",
"E005": "👩",
"E004": "👨",
"E04E": "👼",
"E11C": "💀",
"E003": "💋",
"E04A": "☀",
"E04B": "☔",
"E049": "☁",
"E048": "⛄",
"E04C": "🌙",
"E13D": "⚡",
"E43E": "🌊",
"E04F": "🐱",
"E052": "🐶",
"E053": "🐭",
"E524": "🐹",
"E52C": "🐰",
"E52A": "🐺",
"E531": "🐸",
"E050": "🐯",
"E527": "🐨",
"E051": "🐻",
"E10B": "🐷",
"E52B": "🐮",
"E52F": "🐗",
"E109": "🐵",
"E01A": "🐴",
"E52D": "🐍",
"E521": "🐦",
"E52E": "雞",
"E055": "🐧",
"E525": "🐛",
"E10A": "🐙",
"E522": "🐠",
"E054": "🐳",
"E520": "🐬",
"E032": "🌹",
"E303": "🌺",
"E307": "🌴",
"E308": "🌵",
"E437": "💝",
"E445": "🎃",
"E448": "🎅",
"E033": "🎄",
"E325": "🔔",
"E310": "🎈",
"E126": "💿",
"E008": "📷",
"E03D": "🎥",
"E00C": "💻",
"E12A": "📺",
"E009": "☎",
"E145": "🔓",
"E144": "🔒",
"E03F": "🔑",
"E116": "🔨",
"E10F": "💡",
"E101": "📫",
"E13F": "🛀",
"E12F": "💰",
"E311": "💣",
"E113": "🔫",
"E30F": "💊",
"E42B": "🏈",
"E42A": "🏀",
"E018": "⚽",
"E016": "⚾",
"E014": "⛳",
"E131": "🏆",
"E12B": "👾",
"E03C": "🎤",
"E041": "🎸",
"E322": "👙",
"E10E": "👑",
"E43C": "🌂",
"E323": "👜",
"E31C": "💄",
"E034": "💍",
"E035": "💎",
"E045": "☕",
"E047": "🍺",
"E30C": "🍻",
"E044": "🍸",
"E120": "🍔",
"E33B": "🍟",
"E33F": "🍝",
"E344": "🍣",
"E340": "🍜",
"E147": "🍳",
"E33A": "🍦",
"E34B": "🎂",
"E345": "🍅",
"E01D": "✈",
"E10D": "🚀",
"E136": "🚲",
"E435": "🚄",
"E252": "⚠",
"E132": "🏁",
"E138": "🚹",
"E139": "🚺",
"E332": "⭕",
"E333": "✖",
"E24E": "©",
"E24F": "®",
"E537": "™",
"[發]": "[發]",
"[小狗]": "[小狗]"
}
2、新建解析表情方法文件emjoymethod.js。
import Vue from 'vue';
import {
emojisAmap,
emojisBmap,
emojiReg,
emojiString,
wChartReg,
wChatEmojis,
wChatToUi
} from './emjoydata';
// 解析emoji表情 以及換行回車
Vue.prototype.parsingEmoji = function (value) {
if (!value) return '';
let str = value;
str = str.replace(/\n/gi, '<br>');
// str = EmojiUnicode.trans(str);
// var reg = /^\[.*\]$/gi;
var reg = /\[+[^\[\]]+\]/g;
str = str.replace(reg, function (s) {
var s = s.split("[")[1].split(']')[0];
if (emojiString.indexOf(s) != -1) {
return '<span class="chat-emoji emoji_b ' + emojisBmap['[' + s + ']'] + '" data-name="' + s + '"></span>';
} else if(emojisAmap[s]){
return '<span class="chat-emoji emoji_a ' + emojisAmap[s] + '" data-name="' + s + '"></span>';
}else{
return '['+s+']';
};
});
str = str.replace(emojiReg, function (emo) {
var emo = emo.replace(/\\/g, '\\');
return '<span class="chat-emoji emoji_b ' + emojisBmap[emo] + '" data-name="' + emo + '"></span>';
});
// 微信emoji=》unicode表情規則
str = str.replace(wChartReg, function (wCeo) {
return '<span class="chat-emoji emoji_b ' + wChatEmojis[_escapeToUtf32(wCeo).toLocaleUpperCase()] + '" data-name="' + wChatToUi[_escapeToUtf32(wCeo).toLocaleUpperCase()] + '"></span>';
});
return str;
};
//編碼轉換
function _escapeToUtf32(str) {
var escaped = [],
unicodeCodes = _convertStringToUnicodeCodePoints(str),
i = 0,
l = unicodeCodes.length,
hex;
for (; i < l; i++) {
hex = unicodeCodes[i].toString(16);
escaped.push('0000'.substr(hex.length) + hex);
}
return escaped.join('-');
}
function _convertStringToUnicodeCodePoints(str) {
var surrogate1st = 0,
unicodeCodes = [],
i = 0,
l = str.length;
for (; i < l; i++) {
var utf16Code = str.charCodeAt(i);
if (surrogate1st != 0) {
if (utf16Code >= 0xDC00 && utf16Code <= 0xDFFF) {
var surrogate2nd = utf16Code,
unicodeCode = (surrogate1st - 0xD800) * (1 << 10) + (1 << 16) + (surrogate2nd - 0xDC00);
unicodeCodes.push(unicodeCode);
}
surrogate1st = 0;
} else if (utf16Code >= 0xD800 && utf16Code <= 0xDBFF) {
surrogate1st = utf16Code;
} else {
unicodeCodes.push(utf16Code);
}
}
return unicodeCodes;
}
3、新建表情樣式文件emjoy.css
.emoji_a,.emoji_b{
width: 21px;
height: 21px;
display:inline-block;
vertical-align: middle;
overflow: hidden;
}
.emoji_a {
background: url("../imgs/emjoy/emoji_.png") no-repeat;
}
.emoji_b {
background: url("../imgs/emjoy/emoji_b.png") no-repeat;
}
span.emojis_0 {
background-position: 0px 0px !important
}
span.emojis_1 {
background-position: -24px 0px !important
}
span.emojis_2 {
background-position: -48px 0px !important
}
span.emojis_3 {
background-position: -72px 0px !important
}
span.emojis_4 {
background-position: -96px 0px !important
}
span.emojis_5 {
background-position: -120px 0px !important
}
span.emojis_6 {
background-position: -144px 0px !important
}
span.emojis_7 {
background-position: -168px 0px !important
}
span.emojis_8 {
background-position: -192px 0px !important
}
span.emojis_9 {
background-position: -216px 0px !important
}
span.emojis_10 {
background-position: -240px 0px !important
}
span.emojis_11 {
background-position: -264px 0px !important
}
span.emojis_12 {
background-position: -288px 0px !important
}
span.emojis_13 {
background-position: -312px 0px !important
}
span.emojis_14 {
background-position: -336px 0px !important
}
span.emojis_15 {
background-position: 0px -24px !important
}
span.emojis_16 {
background-position: -24px -24px !important
}
span.emojis_17 {
background-position: -48px -24px !important
}
span.emojis_18 {
background-position: -72px -24px !important
}
span.emojis_19 {
background-position: -96px -24px !important
}
span.emojis_20 {
background-position: -120px -24px !important
}
span.emojis_21 {
background-position: -144px -24px !important
}
span.emojis_22 {
background-position: -168px -24px !important
}
span.emojis_23 {
background-position: -192px -24px !important
}
span.emojis_24 {
background-position: -216px -24px !important
}
span.emojis_25 {
background-position: -240px -24px !important
}
span.emojis_26 {
background-position: -264px -24px !important
}
span.emojis_27 {
background-position: -288px -24px !important
}
span.emojis_28 {
background-position: -312px -24px !important
}
span.emojis_29 {
background-position: -336px -24px !important
}
span.emojis_30 {
background-position: 0px -48px !important
}
span.emojis_31 {
background-position: -24px -48px !important
}
span.emojis_32 {
background-position: -48px -48px !important
}
span.emojis_33 {
background-position: -72px -48px !important
}
span.emojis_34 {
background-position: -96px -48px !important
}
span.emojis_35 {
background-position: -120px -48px !important
}
span.emojis_36 {
background-position: -144px -48px !important
}
span.emojis_37 {
background-position: -168px -48px !important
}
span.emojis_38 {
background-position: -192px -48px !important
}
span.emojis_39 {
background-position: -216px -48px !important
}
span.emojis_40 {
background-position: -240px -48px !important
}
span.emojis_41 {
background-position: -264px -48px !important
}
span.emojis_42 {
background-position: -288px -48px !important
}
span.emojis_43 {
background-position: -312px -48px !important
}
span.emojis_44 {
background-position: -336px -48px !important
}
span.emojis_45 {
background-position: 0px -72px !important
}
span.emojis_46 {
background-position: -24px -72px !important
}
span.emojis_47 {
background-position: -48px -72px !important
}
span.emojis_48 {
background-position: -72px -72px !important
}
span.emojis_49 {
background-position: -96px -72px !important
}
span.emojis_50 {
background-position: -120px -72px !important
}
span.emojis_51 {
background-position: -144px -72px !important
}
span.emojis_52 {
background-position: -168px -72px !important
}
span.emojis_53 {
background-position: -192px -72px !important
}
span.emojis_54 {
background-position: -216px -72px !important
}
span.emojis_55 {
background-position: -240px -72px !important
}
span.emojis_56 {
background-position: -264px -72px !important
}
span.emojis_57 {
background-position: -288px -72px !important
}
span.emojis_58 {
background-position: -312px -72px !important
}
span.emojis_59 {
background-position: -336px -72px !important
}
span.emojis_60 {
background-position: 0px -96px !important
}
span.emojis_61 {
background-position: -24px -96px !important
}
span.emojis_62 {
background-position: -48px -96px !important
}
span.emojis_63 {
background-position: -72px -96px !important
}
span.emojis_64 {
background-position: -96px -96px !important
}
span.emojis_65 {
background-position: -120px -96px !important
}
span.emojis_66 {
background-position: -144px -96px !important
}
span.emojis_67 {
background-position: -168px -96px !important
}
span.emojis_68 {
background-position: -192px -96px !important
}
span.emojis_69 {
background-position: -216px -96px !important
}
span.emojis_70 {
background-position: -240px -96px !important
}
span.emojis_71 {
background-position: -264px -96px !important
}
span.emojis_72 {
background-position: -288px -96px !important
}
span.emojis_73 {
background-position: -312px -96px !important
}
span.emojis_74 {
background-position: -336px -96px !important
}
span.emojis_75 {
background-position: 0px -120px !important
}
span.emojis_76 {
background-position: -24px -120px !important
}
span.emojis_77 {
background-position: -48px -120px !important
}
span.emojis_78 {
background-position: -72px -120px !important
}
span.emojis_79 {
background-position: -96px -120px !important
}
span.emojis_80 {
background-position: -120px -120px !important
}
span.emojis_81 {
background-position: -144px -120px !important
}
span.emojis_82 {
background-position: -168px -120px !important
}
span.emojis_83 {
background-position: -192px -120px !important
}
span.emojis_84 {
background-position: -216px -120px !important
}
span.emojis_85 {
background-position: -240px -120px !important
}
span.emojis_86 {
background-position: -264px -120px !important
}
span.emojis_87 {
background-position: -288px -120px !important
}
span.emojis_88 {
background-position: -312px -120px !important
}
span.emojis_89 {
background-position: -336px -120px !important
}
span.emojis_90 {
background-position: 0px -144px !important
}
span.emojis_91 {
background-position: -24px -144px !important
}
span.emojis_92 {
background-position: -48px -144px !important
}
span.emojis_93 {
background-position: -72px -144px !important
}
span.emojis_94 {
background-position: -96px -144px !important
}
span.emojis_95 {
background-position: -120px -144px !important
}
span.emojis_96 {
background-position: -144px -144px !important
}
span.emojis_97 {
background-position: -168px -144px !important
}
span.emojis_98 {
background-position: -192px -144px !important
}
span.emojis_99 {
background-position: -216px -144px !important
}
span.emojis_100 {
background-position: -240px -144px !important
}
span.emojis_101 {
background-position: -264px -144px !important
}
span.emojis_102 {
background-position: -288px -144px !important
}
span.emojis_103 {
background-position: -312px -144px !important
}
span.emojis_104 {
background-position: -336px -144px !important
}
span.emojis_105 {
background-position: 0px -168px !important
}
span.emojis_106 {
background-position: -24px -168px !important
}
span.emojis_107 {
background-position: -48px -168px !important
}
span.emojis_108 {
background-position: -72px -168px !important
}
span.emojis_109 {
background-position: -96px -168px !important
}
span.emojis_110 {
background-position: -120px -168px !important
}
span.emojis_111 {
background-position: -144px -168px !important
}
span.emojis_112 {
background-position: -168px -168px !important
}
span.emojis_113 {
background-position: -192px -168px !important
}
span.emojis_114 {
background-position: -216px -168px !important
}
span.emojis_115 {
background-position: -240px -168px !important
}
span.emojis_116 {
background-position: -264px -168px !important
}
span.emojis_117 {
background-position: -288px -168px !important
}
span.emojis_118 {
background-position: -312px -168px !important
}
span.emojis_119 {
background-position: -336px -168px !important
}
span.emojis_120 {
background-position: 0px -192px !important
}
span.emojis_121 {
background-position: -24px -192px !important
}
span.emojis_122 {
background-position: -48px -192px !important
}
span.emojis_123 {
background-position: -72px -192px !important
}
span.emojis_124 {
background-position: -96px -192px !important
}
span.emojis_125 {
background-position: -120px -192px !important
}
span.emojib_0 {
background-position: 0px 0px !important
}
span.emojib_1 {
background-position: -24px 0px !important
}
span.emojib_2 {
background-position: -48px 0px !important
}
span.emojib_3 {
background-position: -72px 0px !important
}
span.emojib_4 {
background-position: -96px 0px !important
}
span.emojib_5 {
background-position: -120px 0px !important
}
span.emojib_6 {
background-position: -144px 0px !important
}
span.emojib_7 {
background-position: -168px 0px !important
}
span.emojib_8 {
background-position: -192px 0px !important
}
span.emojib_9 {
background-position: -216px 0px !important
}
span.emojib_10 {
background-position: -240px 0px !important
}
span.emojib_11 {
background-position: -264px 0px !important
}
span.emojib_12 {
background-position: -288px 0px !important
}
span.emojib_13 {
background-position: -312px 0px !important
}
span.emojib_14 {
background-position: -336px 0px !important
}
span.emojib_15 {
background-position: 0px -24px !important
}
span.emojib_16 {
background-position: -24px -24px !important
}
span.emojib_17 {
background-position: -48px -24px !important
}
span.emojib_18 {
background-position: -72px -24px !important
}
span.emojib_19 {
background-position: -96px -24px !important
}
span.emojib_20 {
background-position: -120px -24px !important
}
span.emojib_21 {
background-position: -144px -24px !important
}
span.emojib_22 {
background-position: -168px -24px !important
}
span.emojib_23 {
background-position: -192px -24px !important
}
span.emojib_24 {
background-position: -216px -24px !important
}
span.emojib_25 {
background-position: -240px -24px !important
}
span.emojib_26 {
background-position: -264px -24px !important
}
span.emojib_27 {
background-position: -288px -24px !important
}
span.emojib_28 {
background-position: -312px -24px !important
}
span.emojib_29 {
background-position: -336px -24px !important
}
span.emojib_30 {
background-position: 0px -48px !important
}
span.emojib_31 {
background-position: -24px -48px !important
}
span.emojib_32 {
background-position: -48px -48px !important
}
span.emojib_33 {
background-position: -72px -48px !important
}
span.emojib_34 {
background-position: -96px -48px !important
}
span.emojib_35 {
background-position: -120px -48px !important
}
span.emojib_36 {
background-position: -144px -48px !important
}
span.emojib_37 {
background-position: -168px -48px !important
}
span.emojib_38 {
background-position: -192px -48px !important
}
span.emojib_39 {
background-position: -216px -48px !important
}
span.emojib_40 {
background-position: -240px -48px !important
}
span.emojib_41 {
background-position: -264px -48px !important
}
span.emojib_42 {
background-position: -288px -48px !important
}
span.emojib_43 {
background-position: -312px -48px !important
}
span.emojib_44 {
background-position: -336px -48px !important
}
span.emojib_45 {
background-position: 0px -72px !important
}
span.emojib_46 {
background-position: -24px -72px !important
}
span.emojib_47 {
background-position: -48px -72px !important
}
span.emojib_48 {
background-position: -72px -72px !important
}
span.emojib_49 {
background-position: -96px -72px !important
}
span.emojib_50 {
background-position: -120px -72px !important
}
span.emojib_51 {
background-position: -144px -72px !important
}
span.emojib_52 {
background-position: -168px -72px !important
}
span.emojib_53 {
background-position: -192px -72px !important
}
span.emojib_54 {
background-position: -216px -72px !important
}
span.emojib_55 {
background-position: -240px -72px !important
}
span.emojib_56 {
background-position: -264px -72px !important
}
span.emojib_57 {
background-position: -288px -72px !important
}
span.emojib_58 {
background-position: -312px -72px !important
}
span.emojib_59 {
background-position: -336px -72px !important
}
span.emojib_60 {
background-position: 0px -96px !important
}
span.emojib_61 {
background-position: -24px -96px !important
}
span.emojib_62 {
background-position: -48px -96px !important
}
span.emojib_63 {
background-position: -72px -96px !important
}
span.emojib_64 {
background-position: -96px -96px !important
}
span.emojib_65 {
background-position: -120px -96px !important
}
span.emojib_66 {
background-position: -144px -96px !important
}
span.emojib_67 {
background-position: -168px -96px !important
}
span.emojib_68 {
background-position: -192px -96px !important
}
span.emojib_69 {
background-position: -216px -96px !important
}
span.emojib_70 {
background-position: -240px -96px !important
}
span.emojib_71 {
background-position: -264px -96px !important
}
span.emojib_72 {
background-position: -288px -96px !important
}
span.emojib_73 {
background-position: -312px -96px !important
}
span.emojib_74 {
background-position: -336px -96px !important
}
span.emojib_75 {
background-position: 0px -120px !important
}
span.emojib_76 {
background-position: -24px -120px !important
}
span.emojib_77 {
background-position: -48px -120px !important
}
span.emojib_78 {
background-position: -72px -120px !important
}
span.emojib_79 {
background-position: -96px -120px !important
}
span.emojib_80 {
background-position: -120px -120px !important
}
span.emojib_81 {
background-position: -144px -120px !important
}
span.emojib_82 {
background-position: -168px -120px !important
}
span.emojib_83 {
background-position: -192px -120px !important
}
span.emojib_84 {
background-position: -216px -120px !important
}
span.emojib_85 {
background-position: -240px -120px !important
}
span.emojib_86 {
background-position: -264px -120px !important
}
span.emojib_87 {
background-position: -288px -120px !important
}
span.emojib_88 {
background-position: -312px -120px !important
}
span.emojib_89 {
background-position: -336px -120px !important
}
span.emojib_90 {
background-position: 0px -144px !important
}
span.emojib_91 {
background-position: -24px -144px !important
}
span.emojib_92 {
background-position: -48px -144px !important
}
span.emojib_93 {
background-position: -72px -144px !important
}
span.emojib_94 {
background-position: -96px -144px !important
}
span.emojib_95 {
background-position: -120px -144px !important
}
span.emojib_96 {
background-position: -144px -144px !important
}
span.emojib_97 {
background-position: -168px -144px !important
}
span.emojib_98 {
background-position: -192px -144px !important
}
span.emojib_99 {
background-position: -216px -144px !important
}
span.emojib_100 {
background-position: -240px -144px !important
}
span.emojib_101 {
background-position: -264px -144px !important
}
span.emojib_102 {
background-position: -288px -144px !important
}
span.emojib_103 {
background-position: -312px -144px !important
}
span.emojib_104 {
background-position: -336px -144px !important
}
span.emojib_105 {
background-position: 0px -168px !important
}
span.emojib_106 {
background-position: -24px -168px !important
}
span.emojib_107 {
background-position: -48px -168px !important
}
span.emojib_108 {
background-position: -72px -168px !important
}
span.emojib_109 {
background-position: -96px -168px !important
}
span.emojib_110 {
background-position: -120px -168px !important
}
span.emojib_111 {
background-position: -144px -168px !important
}
span.emojib_112 {
background-position: -168px -168px !important
}
span.emojib_113 {
background-position: -192px -168px !important
}
span.emojib_114 {
background-position: -216px -168px !important
}
span.emojib_115 {
background-position: -240px -168px !important
}
span.emojib_116 {
background-position: -264px -168px !important
}
span.emojib_117 {
background-position: -288px -168px !important
}
span.emojib_118 {
background-position: -312px -168px !important
}
span.emojib_119 {
background-position: -336px -168px !important
}
span.emojib_120 {
background-position: 0px -192px !important
}
span.emojib_121 {
background-position: -24px -192px !important
}
span.emojib_122 {
background-position: -48px -192px !important
}
span.emojib_123 {
background-position: -72px -192px !important
}
span.emojib_124 {
background-position: -96px -192px !important
}
span.emojib_125 {
background-position: -120px -192px !important
}
span.emojib_126 {
background-position: -144px -192px !important
}
span.emojib_127 {
background-position: -168px -192px !important
}
span.emojib_128 {
background-position: -192px -192px !important
}
span.emojib_129 {
background-position: -216px -192px !important
}
span.emojib_130 {
background-position: -240px -192px !important
}
span.emojib_131 {
background-position: -264px -192px !important
}
span.emojib_132 {
background-position: -288px -192px !important
}
span.emojib_133 {
background-position: -312px -192px !important
}
span.emojib_134 {
background-position: -336px -192px !important
}
span.emojib_135 {
background-position: 0px -216px !important
}
span.emojib_136 {
background-position: -24px -216px !important
}
span.emojib_137 {
background-position: -48px -216px !important
}
span.emojib_138 {
background-position: -72px -216px !important
}
span.emojib_139 {
background-position: -96px -216px !important
}
span.emojib_140 {
background-position: -120px -216px !important
}
span.emojib_141 {
background-position: -144px -216px !important
}
span.emojib_142 {
background-position: -168px -216px !important
}
span.emojib_143 {
background-position: -192px -216px !important
}
span.emojib_144 {
background-position: -216px -216px !important
}
span.emojib_145 {
background-position: -240px -216px !important
}
span.emojib_146 {
background-position: -264px -216px !important
}
span.emojib_147 {
background-position: -288px -216px !important
}
span.emojib_148 {
background-position: -312px -216px !important
}
span.emojib_149 {
background-position: -336px -216px !important
}
span.emojib_150 {
background-position: 0px -240px !important
}
span.emojib_151 {
background-position: -24px -240px !important
}
span.emojib_152 {
background-position: -48px -240px !important
}
span.emojib_153 {
background-position: -72px -240px !important
}
span.emojib_154 {
background-position: -96px -240px !important
}
span.emojib_155 {
background-position: -120px -240px !important
}
span.emojib_156 {
background-position: -144px -240px !important
}
span.emojib_157 {
background-position: -168px -240px !important
}
span.emojib_158 {
background-position: -192px -240px !important
}
span.emojib_159 {
background-position: -216px -240px !important
}
span.emojib_160 {
background-position: -240px -240px !important
}
span.emojib_161 {
background-position: -264px -240px !important
}
span.emojib_162 {
background-position: -288px -240px !important
}
span.emojib_163 {
background-position: -312px -240px !important
}
span.emojib_164 {
background-position: -336px -240px !important
}
span.emojib_165 {
background-position: 0px -264px !important
}
span.emojib_166 {
background-position: -24px -264px !important
}
span.emojib_167 {
background-position: -48px -264px !important
}
span.emojib_168 {
background-position: -72px -264px !important
}
span.emojib_169 {
background-position: -96px -264px !important
}
span.emojib_170 {
background-position: -120px -264px !important
}
span.emojib_171 {
background-position: -144px -264px !important
}
span.emojib_172 {
background-position: -168px -264px !important
}
span.emojib_173 {
background-position: -192px -264px !important
}
span.emojib_174 {
background-position: -216px -264px !important
}
span.emojib_175 {
background-position: -240px -264px !important
}
span.emojib_176 {
background-position: -264px -264px !important
}
span.emojib_177 {
background-position: -288px -264px !important
}
4、表情圖片放到對應的目錄下，圖片如下：
1、emoji_.png
2、emoji_b.png
5、使用：
在main.js中引入emjoymethod.js(方法文件)和emjoy.css樣式文件即可。
頁面中使用時直接用方法名即可，例如:
var str = '明天約嗎？[奸笑]'
<span v-html='parsingEmoji(str)'></span>