前端实现检索结果关键字标红

新建utils.js文件

export function searchKeys(val, keywords) {
  let list = keywords && keywords.split(' ') || {}
  val = val + ''
  if (list.length) {
    list.map(keyword => {
      let words=val.match(new RegExp(keyword, 'ig'))
      if (words&&words[0]&&val.indexOf(words[0]) !== -1) {
        val = val.replace(words, '<font color="red">' + words + '</font>')
      } else {
          return val
      }
    })
  }
  return val
}

使用

import { searchKeys } from './utils.js'

<span v-html="searchKeys(text, keyWords)"> </span>