vue2實現搜索結果中的搜索關鍵字高亮的代碼

// 篩選變色
brightenKeyword(val, keyword) {
 val = val + '';
 if (val.indexOf(keyword) !== -1 && keyword !== '') {
 return val.replace(keyword, '<font color="#409EFF">' + keyword + '</font>')
 } else {
 return val
 }
}
// 或者用正則表達式
brightenKeyword(val, keyword) {
 const Reg = new RegExp(keyword, 'i');
 if (val) {
 return val.replace(Reg, `<span style="color: #409EFF;">${keyword}</span>`);
 }
}
// 使用方法
<el-table-column label="維護內容">
 <template slot-scope="scope">
 <span v-html="brightenKeyword(scope.row.strContent, filters.strContent)" ></span>
 </template>
</el-table-column>