美文网首页
聊天相关1>收到消息组装给@用户加标签

聊天相关1>收到消息组装给@用户加标签

作者: 衬fzy | 来源:发表于2023-02-16 14:21 被阅读0次

找到相关@用户 内容并重新组装thml

orderMsgMemberArr: [{ username: 'leibo2' }, { username: 'leibo' }]// 聊天室的对应账号

    // let txt = '@leibo2 '
    // let txt = '11 @leibo2 (雷波公安2) 来看看 @leibo 123'
    // let txt = '@leibo2 (雷波公安2) 来看看 @leibo 123'
    // let txt = JSON.parse('"11\\n22\"')
    let txt = '@leibo 1 @leibo2 2\n@leibo3 3 @leibo4 4'let txt = '@leibo 1 @leibo2 2\n@leibo3 3 @leibo4 4'
    let html = this.atFilter(txt.replace(/\n/g, "<br/>"))// 换行替换成br
    console.log(html) // <span>leibo</span> 1 <span>leibo2</span> 2<br/> <span>leibo3</span> 3 <span>leibo4</span> 4
/** 找到相关@用户 内容并重新组装thml */
    atFilter(txt) {
      let htmlTxt = ''
      let index1 = null; let index2 = null;
      let size = 0
      /** 递归 */
      let htmlFun = (txt, index1, index2) => {
        // console.log(size, txt, index1, index2)
        if (size == 0 && txt.indexOf('@') == 0 || txt.indexOf(' @') == 0) {
          // 首次并且第一个是@
          size++
          index1 = txt.indexOf('@')
          index2 = txt.indexOf(' ', index1 + 1)
          if (index2 != -1) {
            let userTxt = txt.slice(index1 + 1, index2)
            // console.log(userTxt)
            if (this.orderMsgMemberArr.some((v) => (v.username == userTxt))) {
              htmlTxt = `<span>${txt.slice(index1 + 1, index2)}</span>`
              // console.log(htmlTxt)
              if (index2 != txt.length - 1) {
                htmlFun(txt.slice(index2), index1, index2)
              }
            } else {
              htmlTxt = `${txt.slice(index1, index2 + 1)}`
              // console.log(htmlTxt)
              if (index2 != txt.length - 1) {
                htmlFun(txt.slice(index2), index1, index2)
              }
            }
          } else {
            htmlTxt = txt
          }
        } else {
          size++
          if (index2 == null) {
            index1 = txt.indexOf(' @')
            index2 = txt.indexOf(' ', index1 + 2)
            // console.log(txt)
            // console.log(index1, index2)
            if (index1 == -1) {
              htmlTxt = txt
            } else if (index2 > 0 && index2 == txt.length - 1) {
              let userTxt = txt.slice(index1 + 2, index2)
              if (this.orderMsgMemberArr.some((v) => (v.username == userTxt))) {
                htmlTxt += `${txt.slice(0, index1)} <span>${txt.slice(index1 + 2, index2)}</span>`
              } else {
                htmlTxt += `${txt.slice(0, index1)} ${txt.slice(index1 + 2, index2)}`
              }
            } else {
              let userTxt = txt.slice(index1 + 2, index2)
              // console.log(userTxt)
              if (this.orderMsgMemberArr.some((v) => (v.username == userTxt))) {
                htmlTxt += `${txt.slice(0, index1)} <span>${txt.slice(index1 + 2, index2)}</span>`
              } else {
                htmlTxt += `${txt.slice(0, index1)} ${txt.slice(index1 + 2, index2)}`
              }
              htmlFun(txt.slice(index2), index1, index2)
            }
          } else {
            let index0 = txt.indexOf('<br/>@')
            index1 = txt.indexOf(' @')
            // console.log(index0, index1)
            if (index0 != -1 && index0 < index1) {
              index1 = index0 + 4
              index2 = txt.indexOf(' ', index1 + 2)
              if (index1 == -1) {
                htmlTxt += txt
                // console.log(htmlTxt)
              } else {
                let userTxt = txt.slice(index1 + 2, index2)
                // console.log(userTxt)
                // console.log(txt)
                // console.log(txt.slice(0, index1 + 1))
                if (this.orderMsgMemberArr.some((v) => (v.username == userTxt))) {
                  htmlTxt += `${txt.slice(0, index1 + 1)} <span>${txt.slice(index1 + 2, index2)}</span>`
                } else {
                  htmlTxt += `${txt.slice(0, index1 + 1)} <span>${txt.slice(index1 + 2, index2)}</span>`
                }
                // console.log(htmlTxt)
                htmlFun(txt.slice(index2), index1, index2)
              }
            } else {
              index2 = txt.indexOf(' ', index1 + 2)
              // console.log(index1, index2)
              if (index1 == -1) {
                htmlTxt += txt
                // console.log(htmlTxt)
              } else {
                let userTxt = txt.slice(index1 + 2, index2)
                // console.log(userTxt)
                // console.log(txt)
                // console.log(txt.slice(0, index1 + 1))
                if (this.orderMsgMemberArr.some((v) => (v.username == userTxt))) {
                  htmlTxt += `${txt.slice(0, index1)} <span>${txt.slice(index1 + 2, index2)}</span>`
                } else {
                  htmlTxt += `${txt.slice(0, index1)} <span>${txt.slice(index1 + 2, index2)}</span>`
                }
                // console.log(htmlTxt)
                htmlFun(txt.slice(index2), index1, index2)
              }
            }
          }
        }
        // console.log(htmlTxt)
        return htmlTxt
      }
      return htmlFun(txt, index1, index2)
    }

相关文章

网友评论

      本文标题:聊天相关1>收到消息组装给@用户加标签

      本文链接:https://www.haomeiwen.com/subject/itupkdtx.html