一、实现功能:
通过搜索框搜索关键字,将搜索得到的结果里包含关键字的字体实现高亮的效果
二、实现思路:
使用js的indexof()方法检验是否包含某字符串,以及unshift() 方法可向数组的开头添加元素,新加一个key属性,将含有关键字的那部分字符串的key属性标记为true,其他均为false
三、核心代码:
tips:使用uni-app框架,使用原生的朋友请自行修改对应的代码即可。
html部分:
<template>
<view>
<view class="searchBox">
<view class="searchImgBox">
<image class="searchImg" src="/static/home/speaker.png"></image>
</view>
<input placeholder="请输入要搜索的问题" v-model="searchInput" class="searchText"></input>
<view class="searchImgBox" @tap="searchQuestion">
<image class="searchImg" src="/static/home/search.png"></image>
</view>
</view>
<view class="q