vue js给字符串中包含的部分字符串加样式

            let searchStr = this.formInline.logId, // 需要特殊样式的字符串
              srtEndIndex = 0,
              srtStartIndex = 0,
              newStr = ''
            data.forEach((item) => {  // 后端返回的列表数据
              if (item.indexOf(searchStr) > -1) {
              srtEndIndex = item.indexOf(searchStr) + searchStr.length
              srtStartIndex = item.indexOf(searchStr)
              newStr =
                item.substring(0, srtEndIndex) +
                '</span>' +
                item.substring(srtEndIndex)
              newStr =
                newStr.substring(0, srtStartIndex) +
                '<span style="color:#e6a23c">' +
                newStr.substring(srtStartIndex)
              } else {
                newStr = item
              }

              this.list.push(newStr)
            })

一看代码都能懂的起 在这里存下 以后万一用的到 哈哈哈！

发现上面的好麻烦 有简单办法 就把选中的字符串用 样式标签加字符串 给替换掉就可

   // item 为总字符串  source为原字符串  newStr为加上样式标签后的字符串
    replaceAll(item, sourceStr, newStr) {
      let reg = new RegExp(sourceStr, 'g') //g,表示全部替换。
      return item.replace(reg, newStr)
    },

              // searchStr 是个变量 就是需要加样式的字符串
              if (item.indexOf(searchStr) != -1) {
                newStr = this.replaceAll(
                  item,
                  searchStr,
                  '<span style="color:#e6a23c">' + searchStr + '</span>',
                )
                console.log(newStr)
              } else {
                newStr = item
              }

好啦好啦 记录一下下 嘿嘿嘿~~~~~