关键词高亮显示

如图形式

以下是高亮函数

stringifyObj(obj, keyword) {  
    if (!obj) return '';     
    const str = JSON.stringify(obj); // 将object转为字符串    
    let richStr = '';    
    const b = str.split(keyword); // 将字符串以关键词分开    
    b.map((item, index) => {      
        if (index === b.length - 1) { // 最后一个无需再拼接        
            richStr += item;      
        } else {        
            richStr += item + `<span style="color:#f00;">${keyword}</span>`;      
        }    
    });   
    return richStr;
}

显示的时候以富文本形式展示就可以了。

如果针对多个高亮的关键词呢？

stringifyObj(obj, keywords) {
    // 多个关键词的情况下，keywords假设为array形式，如['a', 'b']        
    if (!obj) return '';        
    if (keywords && keywords[0]) {          
        const str = JSON.stringify(obj);          
        let richStr = '';          
        for (let i = 0; i < keywords.length; i++) {            
            const a = keywords[i];            
            const b = str.split(a);            
            b.map((item, index) => {              
                if (index === b.length - 1) {                
                    richStr += item;              
                } else {                
                    richStr += item + `<span style="color:#f00;">${a}</span>`;
                }            
            });          
        }          
        return richStr;        
    } else {          
        return JSON.stringify(obj);        
    }      
}