replace替换不区分大小写
let nameHtml=name.replace(
new RegExp(this.searchName,'gi'),
`<span style='color: rgb(12, 219, 222);'>$&</span>`
)
这一段是把名称里的关键字高亮展示,且不区分大小写,$&代表正则表达式里找到匹配内容,gi是正则的标记:
g: global match(全局匹配)
i: ignore case(忽略大小写)
gi: both global match and ignore case(匹配所有可能的值,也忽略大小写)
vue的render函数里渲染html字符串
return h(
'span',
{
domProps: {
innerHTML: nameHtml
}
},
[]
)
创建一个标签,给domProps里面的innerHTML赋值为html字符串,然后会自动解析。