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

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

方法一、篩選變色

brightenKeyword(val, keyword) {

val = val + '';

if (val.indexOf(keyword) !== -1 && keyword !== '') {

return val.replace(keyword, '' + keyword + '/<font>')

} else {

return val;

}

}

方法二、正則表達式

const Reg = new RegExp(keyword, 'i');

if (val) {

return val.replace(Reg, `${keyword}`);

}

使用方法

<el-table-column>

<template>

源碼地址

https://github.com/artdong/vue-admin

效果演示

經典前端面試題每日更新，歡迎參與討論，地址：https://github.com/daily-interview/fe-interview。

更多angular1/2/4/5、ionic1/2/3、react、vue、微信小程序、nodejs等技術文章、視頻教程和開源項目，請關注微信公眾號——全棧弄潮兒。