【开源三方库】Fuse.js:强大、轻巧、零依赖的模糊搜索库

1.简介

Fuse.js是一款功能强大且轻量级的JavaScript模糊搜索库,支持OpenAtom OpenHarmony(以下简称“OpenHarmony”)操作系统,它具备模糊搜索和排序等功能。该库高性能、易于使用、高度可配置,支持多种数据类型和多语言搜索,适用于各种场景,如搜索引擎、电子商务网站和数据可视化,可以帮助用户在包含大量数据的环境中快速地找到相关的搜索结果,并支持高度可定制化的搜索选项。

2.开发环境

安装IDE:支持DevEco Studio 4.0 Beta2(Build Version 4.0.0.400)版本。安装SDK:OpenHarmony API version 9及以上版本。

3.使用方法

使用前需要先安装ohpm-cli请参考安装教程:https://ohpm.openharmony.cn/#/cn/help/quickstart

1、  下载@isrc/fuse.js组件

ohpm install @isrc/fuse.js –-save

2、  在page页面导入

import Fuse from "@isrc/fuse.js"

3、  准备数据集

// 创建一个包含书籍信息的列表数组,作为待搜索的数据
var list = [
  {
    "title": "Old Man's War",
    "author": "John Scalzi",
    "tags": ["fiction"]
  },
  {
    "title": "The Lock Artist",
    "author": "Steve",
    "tags": ["thriller"]
  }
]

4、创建搜索实例

// 配置搜索选项,包括启用分数计算和指定搜索的键(作者和标签)
var options = {
  includeScore: true,
  // 在 'author' 和 'tags' 数组中进行搜索
  keys: ['author', 'tags']
}
 
// 创建一个 Fuse 搜索实例,将列表和选项传递给它
var fuse = new Fuse(list, options)
5、执行搜索,如下示例,搜索结果会存储到result变量中
// 使用 Fuse 搜索实例执行搜索,查找包含 'tion' 的结果
var result = fuse.search('tion')
搜索结果数据结构(result变量内容)示例如下:
[
  {
    "item": {
      "title": "Old Man's War",
      "author": "John Scalzi",
      "tags": ["fiction"]
    },
    "refIndex": 0,
    "score": 0.03
  }
]

可以将变量传入相应显示控件,进行搜索结果展示。Fuse.js支持的搜索配置选项还包括:

更多使用方式和接口可参考库的使用文档:https://ohpm.openharmony.cn/#/cn/detail/@isrc%2Ffuse.js

4.结语

通过本篇文章介绍,您对OpenHarmony Fuse.js组件应该有了初步的了解。我们所有的源码和指导文档都已经开源,如果您对本篇文章内容以及所实现的Demo感兴趣,可以根据本篇文章介绍自行下载OpenHarmony Fuse.js源码进行研究和使用。同时也欢迎更多开发者与我们共享开发成果,分享技术解读与经验心得。

如果大家想更加深入的学习 OpenHarmony 开发的内容,不妨可以参考以下相关学习文档进行学习,助你快速提升自己:

OpenHarmony 开发环境搭建:https://qr18.cn/CgxrRy

《OpenHarmony源码解析》:https://qr18.cn/CgxrRy

  • 搭建开发环境
  • Windows 开发环境的搭建
  • Ubuntu 开发环境搭建
  • Linux 与 Windows 之间的文件共享
  • ……

系统架构分析:https://qr18.cn/CgxrRy

  • 构建子系统
  • 启动流程
  • 子系统
  • 分布式任务调度子系统
  • 分布式通信子系统
  • 驱动子系统
  • ……

OpenHarmony 设备开发学习手册:https://qr18.cn/CgxrRy

在这里插入图片描述

OpenHarmony面试题(内含参考答案):https://qr18.cn/CgxrRy

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:/a/677730.html

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

界面控件DevExpress WinForms的流程图组件 - 可完美复制Visio功能(二)

DevExpress WinForms的Diagram(流程图)组件允许您复制Microsoft Visio中的许多功能,并能在下一个Windows Forms项目中引入信息丰富的图表、流程图和组织图。 P.S:DevExpress WinForms拥有180组件和UI库,能为Windows F…

Solidworks 提取模型中的零件,并组合成一个新的零件,放入特征库

对方发来一个STP文件,其中有模型的部分零件想为我所用。 Shift键鼠标左键 选取需要的零件 在选好零件上右键,选择“孤立” 左边找到部件,ctrl左键选中,选择“插入到新零件” 点 绿色 勾 就选择保存类型,完成 。 打开这…

【技术】工业机器人机械臂安装高速电主轴打磨去毛刺

随着现代工业的发展,机械加工在制造业中扮演着至关重要的角色。然而,机械加工后的零件普遍存在着毛刺问题。这些毛刺不仅影响了零件的外观,更对工序的定位、产品的装配以及性能产生了不良影响,甚至可能导致机械设备损坏等严重事故…

计算机专业本科就业还是考研?考研有哪些热门方向?

考研并不是一个逃避就业的避难所,也不是一个简单的提升待遇的手段。考研是提升自我的途径,特别是对于那些对特定技术领域有浓厚兴趣并愿意深入研究的人来说 一个本科生能够认真学三年,那么他们所掌握的技能和知识不应该逊色于那些通过短期培…

作为表达式调用时,无法解析类修饰器的签名。vue3+ts+vite,使用装饰器时报错

作为表达式调用时,无法解析类修饰器的签名。 The runtime will invoke the decorator with 2 arguments, but the decorator expects 1.ts(1238) 页面也无法打开 解决方案: {"extends": "vue/tsconfig/tsconfig.dom.json","in…

利用Qss切分图片、使用图标

之前一直没有弄明白,现在明白了,记录一下! 一般形式如下: border-image: url(:/icon_btn_menu_40x36.png) 0 80 0 0; 在原始图片上、上右下左、各切一刀、形成的图片区域、即为所取图标。 切的位置分别是距离最上、最右、最下…

09.爬虫---正则解析爬取数据

09.正则解析爬取数据 1.目标网站2.具体实现3.正则表达式分析4.完整代码并存入表格 1.目标网站 直达目标网站 https://movie.douban.com/chart 2.具体实现 我们来拿取一下上面网页的代码如下: from urllib import requesturl https://movie.douban.com/chart headers {Us…

oracle 数字或者小数格式化

select trim(. from to_char(1,fm9999990.9999)),trim(. from to_char(0.1,fm9999990.9999)) from dual

yolov8-obb 旋转目标检测 瑞芯微RKNN芯片部署、地平线Horizon芯片部署、TensorRT部署

特别说明:参考官方开源的yolov8代码、瑞芯微官方文档、地平线的官方文档,如有侵权告知删,谢谢。 模型和完整仿真测试代码,放在github上参考链接 模型和代码。 折腾旋转目标检测的小伙伴们看过来,yolov8旋转目标检测部署…

使用高德地图JS API 开发一些常见使用问题(急救包)

本文记录开发使用高德地图JS API 开发一些常见使用问题 API文档 👉传送门 关于如何引入高德地图JS API方式 请移步前面文章👉使用高德地图JS API 开发一些常见使用方法(急救包) 前篇👉: 使用高德地图JS API 开发——…

面试官:Spring 启动过程是什么样的?详细讲讲你自己的理解!

引言:在面试中,对于 Java 开发者来说,掌握 Spring 框架的原理和使用是至关重要的。其中,了解 Spring 的启动流程、循环依赖问题的解决方法以及与设计模式相关的内容是常见的面试题目。 题目 面试官:Spring 启动过程是…

Element-ui使用上传时弹框选择文件类型

实现效果 1,点击上传,上传文件; 2,选择文件; 3,弹框选择文件类型; 4,选择类型后确定上传; 一,上传 跳过; 二,定义弹框下拉框…

这么好看的AI摄影写真,用Stable Diffusion 即可轻松完成,想要什么风格都可以!

大家好,我是向阳。 今天给大家分享一下如何用AI绘画工具Stable Diffusion 制作摄影奇幻写真,本次教程很简单,跟着我,你也能快速上手!学会了,就去尝试生成一套自己的AI写真吧 AI工具Stable Diffusion 和 教…

Python 实现反转密码加密

反转密码加密是通过反向输出消息进行加密。如,‘Hi,boy!’通过反转加密就会变成 ‘!yob,iH’。加解密的过程是一样的,解密是需要将密文再次反转过来既可以得到原文内容了。 反转加密是一种比较弱的加密方式,一般我们通过一些密文既可以发现它…

【简单学习一下卷积神经网络】-基于肆十二的高考例子

前言一、白话卷积神经网络总结 前言 【参考】 主要是P2⇨手把手教你用tensorflow2训练自己的数据集 -------2024/5/4 一、白话卷积神经网络 高考前需要大量的做题训练---->相当于数据集。 做题过程中【于标准答案进行比对】产生的错题⇨loss(误差) 回…

RaspAP:轻松实现树莓派无线 AP

RaspAP 是一个可以将树莓派轻松部署成无线 AP(Access Point)的软件方案,具有一套响应式的 WebUI 来控制 WiFi,用起来和家用路由器一样方便。RaspAP 可以运行在 Raspbian 上,只需要先给树莓派安装好 Raspbian 系统&…

LeetCode-3067. 在带权树网络中统计可连接服务器对数目【树 深度优先搜索 数组】

LeetCode-3067. 在带权树网络中统计可连接服务器对数目【树 深度优先搜索 数组】 题目描述:解题思路一:dfs,针对当前服务器i有for i, gi in enumerate(g):,不断dfs其的邻居节点for y, wt in gi:,dfs可以计算得到邻居y的…

解决 windows11 文件夹中右键没有出现Git Bash Here的问题?

电脑刚从w10升级到了w11,想要从git拉去项目,但是发现右键菜单下找不到git,如图: 百度了一下,看了看这位大佬 这篇文章 的配置,确实能打开,但右键菜单下还是没有,于是继续搜寻问题的…

Kimichat使用案例008:查找比亚迪、特斯拉等电动车产业链相关股票(用kimichat炒股)

文章目录 一、介绍二、Kimi操作内容三、Kimi输出内容四、kimi操作内容五、Kimi输出内容一、介绍 kimichat可以联网检索,搜索结果更加准确、智能。 二、Kimi操作内容 在kimichat中输入提示词: 找出同时在比亚迪产业链和特斯拉产业链的企业 三、Kimi输出内容 四、kimi操作内容…

成功解决“ModuleNotFoundError: No module named ‘tensorflow_datasets‘”错误的全面指南

成功解决“ModuleNotFoundError: No module named ‘tensorflow_datasets’”错误的全面指南 在Python编程和深度学习项目中,tensorflow_datasets(通常简称为tfds)是一个非常重要的库,它提供了大量现成的数据集,方便…