• 技术文章 >web前端 >js教程

    vue2中实现搜索结果中关键词高亮的代码

    不言不言2018-08-20 14:28:00原创1884
    本篇文章给大家带来的内容是关于vue2中实现搜索结果中关键词高亮的代码,有一定的参考价值,有需要的朋友可以参考一下,希望对你有所帮助。

    // 筛选变色

    brightenKeyword(val, keyword) {
       val = val + '';
       if (val.indexOf(keyword) !== -1 && keyword !== '') {
            return val.replace(keyword, '<font color="#409EFF">' + keyword + '</font>')
       } else {
          return val
        }
    }

    // 使用方法

    <el-table-column label="维护内容">
       <template slot-scope="scope">
          <span v-html="brightenKeyword(scope.row.strContent, filters.strContent)" ></span>
       </template>
    </el-table-column>

    开源项目地址: https://github.com/alex-0407/...

    相关推荐:

    JS的正则replace搜索关键字高亮效果

    用JS将搜索的关键字高亮显示实现代码_javascript技巧

    以上就是vue2中实现搜索结果中关键词高亮的代码的详细内容,更多请关注php中文网其它相关文章!

    声明:本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn核实处理。
    上一篇:vue监听对象的方法以及监听对象中属性的方法介绍(代码) 下一篇:如何实现js中new的功能?js中new的用法
    PHP编程就业班

    相关文章推荐

    • jquery实现页面关键词高亮显示的方法_jquery• javascript实现页面内关键词高亮显示代码_javascript技巧• js 关键词高亮(根据ID/tag高亮关键字)案例介绍_javascript技巧• firefox下javascript实现高亮关键词的方法_javascript技巧• 关键词高亮算法

    全部评论我要评论

  • 取消发布评论发送
  • 1/1

    PHP中文网