vue v-html高亮句子中的单词，不仅要全局匹配还要大小写不敏感

  • Z时代
  • 2024-02-07
  • 分类：IT

vue v-html高亮句子中的单词，不仅要全局匹配还要大小写不敏感

html

 <p
    class="sentence"
    style="display: inline-block"
    v-html="hightlight(i.sentence)"
  >
    {{ i.sentence }}
 </p>
 //高亮
    hightlight(str) {
      const search = this.word;
      var subStr = new RegExp(search); // 匹配关键字正则
      let replaceString = '<span class="highlights-text">' + search + "</span>"; // 高亮替换v-html值
      let result = str.replace(subStr, replaceString);
      return result;
    },

str 传入的是一个英文的句子 比如高亮 is 这个单词 想要把所有的is Is 都标记出来

大小写不明感要怎么写？

回答：

i 执行对大小写不敏感的匹配 g 执行全局匹配

var subStr = new RegExp(search,'ig'); // 匹配关键字正则

回答：

全局替换的方式即可！

以上是 vue v-html高亮句子中的单词，不仅要全局匹配还要大小写不敏感 的全部内容， 来源链接： utcz.com/p/937013.html

回到顶部