Browse Source

微信表情路径改为配置形式

master
xsx 1 year ago
parent
commit
705f005baa
  1. 7
      im-uniapp/.env.js
  2. 18
      im-uniapp/common/emotion.js
  3. 4
      im-uniapp/pages/chat/chat-box.vue

7
im-uniapp/.env.js

@ -1,6 +1,13 @@
//设置环境(打包前修改此变量) //设置环境(打包前修改此变量)
const ENV = "DEV"; const ENV = "DEV";
const UNI_APP = {} const UNI_APP = {}
UNI_APP.EMO_URL = "/static/emoji/";
// #ifdef MP-WEIXIN
// 微信小程序的本地表情包经常莫名失效,建议将表情放到服务器中
// UNI_APP.EMO_URL = "https://www.boxim.online/emoji/";
// #endif
if(ENV=="DEV"){ if(ENV=="DEV"){
UNI_APP.BASE_URL = "http://127.0.0.1:8888"; UNI_APP.BASE_URL = "http://127.0.0.1:8888";
UNI_APP.WS_URL = "ws://127.0.0.1:8878/im"; UNI_APP.WS_URL = "ws://127.0.0.1:8878/im";

18
im-uniapp/common/emotion.js

@ -1,3 +1,6 @@
import UNI_APP from '@/.env.js'
const emoTextList = ['憨笑', '媚眼', '开心', '坏笑', '可怜', '爱心', '笑哭', '拍手', '惊喜', '打气', const emoTextList = ['憨笑', '媚眼', '开心', '坏笑', '可怜', '爱心', '笑哭', '拍手', '惊喜', '打气',
'大哭', '流泪', '饥饿', '难受', '健身', '示爱', '色色', '眨眼', '暴怒', '惊恐', '大哭', '流泪', '饥饿', '难受', '健身', '示爱', '色色', '眨眼', '暴怒', '惊恐',
'思考', '头晕', '大吐', '酷笑', '翻滚', '享受', '鼻涕', '快乐', '雀跃', '微笑', '思考', '头晕', '大吐', '酷笑', '翻滚', '享受', '鼻涕', '快乐', '雀跃', '微笑',
@ -13,30 +16,23 @@ let containEmoji = (content) => {
} }
let transform = (content, extClass) => { let transform = (content, extClass) => {
return content.replace(regex, (emoText) => { return content.replace(regex, (emoText)=>{
// 将匹配结果替换表情图片 // 将匹配结果替换表情图片
let word = emoText.replace(/\#|\;/gi, ''); let word = emoText.replace(/\#|\;/gi, '');
let idx = emoTextList.indexOf(word); let idx = emoTextList.indexOf(word);
if (idx == -1) { if (idx == -1) {
return emoText; return emoText;
} }
let path = textToPath(emoText, true); let path = textToPath(emoText);
let img = `<img src="${path}" class="${extClass}"/>`; let img = `<img src="${path}" class="${extClass}"/>`;
return img; return img;
}); });
} }
let textToPath = (emoText, isRichText) => { let textToPath = (emoText) => {
let word = emoText.replace(/\#|\;/gi, ''); let word = emoText.replace(/\#|\;/gi, '');
let idx = emoTextList.indexOf(word); let idx = emoTextList.indexOf(word);
let path = `/static/emoji/${idx}.gif`; return UNI_APP.EMO_URL + idx + ".gif";
// #ifdef MP-WEIXIN
// 小程序的表情要去掉最前面"/"(但有的时候又不能去掉,十分奇怪)
if (isRichText) {
path = path.slice(1);
}
// #endif
return path;
} }
export default { export default {

4
im-uniapp/pages/chat/chat-box.vue

@ -94,7 +94,7 @@
<scroll-view v-if="chatTabBox === 'emo'" class="chat-emotion" scroll-y="true" <scroll-view v-if="chatTabBox === 'emo'" class="chat-emotion" scroll-y="true"
:style="{height: keyboardHeight+'px'}"> :style="{height: keyboardHeight+'px'}">
<view class="emotion-item-list"> <view class="emotion-item-list">
<image class="emotion-item emoji-large" :title="emoText" :src="$emo.textToPath(emoText,false)" <image class="emotion-item emoji-large" :title="emoText" :src="$emo.textToPath(emoText)"
v-for="(emoText, i) in $emo.emoTextList" :key="i" @click="selectEmoji(emoText)" mode="aspectFit" v-for="(emoText, i) in $emo.emoTextList" :key="i" @click="selectEmoji(emoText)" mode="aspectFit"
lazy-load="true"></image> lazy-load="true"></image>
</view> </view>
@ -370,7 +370,7 @@ export default {
} }
}, },
selectEmoji(emoText) { selectEmoji(emoText) {
let path = this.$emo.textToPath(emoText, true) let path = this.$emo.textToPath(emoText)
// //
this.isReadOnly = true; this.isReadOnly = true;
this.isEmpty = false; this.isEmpty = false;

Loading…
Cancel
Save