uniapp:搜索功能,搜索值高亮提示

<template>    <viewclass="search">        <u-navbartitle="":is-back="false":border-bottom="false"title-color="#000"            :background="{background:'#F5F5F8'}">            <viewclass="page_navbar_warp">                <u-searchshape="square"placeholder="搜索"v-model="keyword":show-action="true"                    action-text="取消" bg-color="#ffffff" search-icon-color="#ABB0BF" color="#000" height="72"                    @custom="$goBack(1,1)" @search="search" @change="change"></u-search>            </view>        </u-navbar>        <viewclass="list">            <viewclass="title">联系人</view>            <viewclass="item"v-for="(item,index) in list":key="index">                <imagesrc="../../static/logo.png"mode=""></image>                <viewclass="right">                    <viewclass="name"v-html="item.title"></view>                    <viewclass="text u-line-1"v-html="item.content"></view>                </view>            </view>            <viewclass="more">更多联系人</view>        </view>    </view></template><script>    export default {        data() {            return {                keyword: '',                list: []            }        },        methods: {            changeColor(result) {                result.map((item, index) => {                    if (this.keyword) {                        let replaceReg = new RegExp(this.keyword, "ig");                        let replaceString = `<span style="color: #FDAD4E">${this.keyword}</span>`;                        result[index].title = item.title.replace(replaceReg, replaceString);                        result[index].content = item.content.replace(replaceReg, replaceString);                    }                });                return result;            },            search(){                if(this.keyword == ''){                    uni.showToast({                        icon:'none',                        title: '请输入搜索内容',                    });                }else{                    // 模拟接口请求数据                    let arr = [{                            title: '天涯过客',                            content:'据说明天有雨'                        },                        {                            title: '彩虹过人',                            content:'测试数据'                        },                        {                            title: '梅开二度',                            content:'测试数据'                        },                        {                            title: '天天向上',                            content:'测试数据'                        }                    ];                    this.list = this.changeColor(arr);                }            },            change(e){                if(e == ''){                    this.list = []                }            },        }    }</script>