OpenHarmony实战开发-搜索功能实现案例、如何使用includes方法对数据实现模糊查询

最新推荐文章于 2024-10-18 20:54:26 发布

不入流HarmonyOS开发

最新推荐文章于 2024-10-18 20:54:26 发布

阅读量456

点赞数 5

分类专栏：鸿蒙 HarmonyOS OpenHarmony 文章标签： harmonyos 鸿蒙开发鸿蒙应用开发华为鸿蒙鸿蒙工程师

本文链接：https://blog.csdn.net/m0_70749039/article/details/137978025

版权

介绍

本示例介绍使用includes方法对数据实现模糊查询

效果图预览

在这里插入图片描述

使用说明

点击首页搜索框跳转到搜索页面
在搜索页面输入框中输入搜索的内容，下方列表自动根据搜索的内容进行筛选渲染
点击筛选后的列表跳转到相应的页面
跳转后会保存搜索历史，搜索历史使用持久化存储处理退出应用再次进入依旧存在
点击搜索历史可以跳转到相应页面

实现思路

1.通过include方法判读是否存在符合条件的数据。

searchFunc(value: string) {
   
    let newListData: ListData[] = [];
    if (this.searchListData !== undefined) {
   
      for (let i = 0; i < this.searchListData.length; i++) {
   
        // 通过includes对输入的字符进行查询
        if (this.searchListData[i].name.toLowerCase().includes(value.toLowerCase())) {
   
          newListData.push(this.searchListData