美文网首页
vue 搜索结果高亮

vue 搜索结果高亮

作者: 小蝴蝶_037a | 来源:发表于2019-06-20 18:22 被阅读0次

    这个是方法,无视大小写,this.allStandard是我这里搜索的关键词

                        //搜索关键字高亮
                        filterKeyLight(text){
                            const Reg = new RegExp(this.allStandard.toUpperCase(), 'i');
                            if(text){
                                return text.replace(Reg, `<span style="color:#FF6020;">${this.allStandard.toUpperCase()}</span>`);
                            }
                        },
    

    把方法放在显示结果的span里 用v-html调用,参数是搜索结果

    <span slot="label" v-html="filterKeyLight(text)"></span>
    
    高亮

    相关文章

      网友评论

          本文标题:vue 搜索结果高亮

          本文链接:https://www.haomeiwen.com/subject/avojqctx.html