OpenHarmony开发者论坛
标题:
【开源三方库】Fuse.js:强大、轻巧、零依赖的模糊搜索库
[打印本页]
作者:
朱伟
时间:
2023-12-18 09:26
标题:
【开源三方库】Fuse.js:强大、轻巧、零依赖的模糊搜索库
[md]## **1.简介**
Fuse.js是一款功能强大且轻量级的JavaScript模糊搜索库,支持OpenAtom OpenHarmony(以下简称“OpenHarmony”)操作系统,它具备模糊搜索和排序等功能。该库高性能、易于使用、高度可配置,支持多种数据类型和多语言搜索,适用于各种场景,如搜索引擎、电子商务网站和数据可视化,可以帮助用户在包含大量数据的环境中快速地找到相关的搜索结果,并支持高度可定制化的搜索选项。
![640.gif](
https://forums-obs.openharmony.c ... oo849yuboro9yk9.gif
"640.gif")
## **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组件
<pre class="code-snippet__js" data-lang="css"><section><code><span class="code-snippet_outer"><span class="code-snippet__selector-tag">ohpm</span> <span class="code-snippet__selector-tag">install</span> @<span class="code-snippet__keyword">isrc</span>/<span class="code-snippet__keyword">fuse</span>.<span class="code-snippet__keyword">js</span> –-save</span></code></section></pre>
2、在page页面导入
<pre class="code-snippet__js" data-lang="javascript"><section><code><span class="code-snippet_outer"><span class="code-snippet__keyword">import</span> Fuse <span class="code-snippet__keyword">from</span> <span class="code-snippet__string">"@isrc/fuse.js"</span></span></code></section></pre>
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支持的搜索配置选项还包括:
![640.png](
https://forums-obs.openharmony.c ... 6n2swty2onsqn2w.png
"640.png")
更多使用方式和接口可参考库的使用文档:
https://ohpm.openharmony.cn/#/cn/detail/@isrc%2Ffuse.js
## 4.结语
通过本篇文章介绍,您对OpenHarmony Fuse.js组件应该有了初步的了解。我们所有的源码和指导文档都已经开源,如果您对本篇文章内容以及所实现的Demo感兴趣,可以根据本篇文章介绍自行下载OpenHarmony Fuse.js源码进行研究和使用。同时也欢迎更多开发者与我们共享开发成果,分享技术解读与经验心得。**
OpenHarmony Fuse.js源码:
https://gitee.com/pommejason/isrc_fuse.js
本篇文章转载自:
https://mp.weixin.qq.com/s/QkWQdbQos_rWdcYpJqvt6g
[/md]
欢迎光临 OpenHarmony开发者论坛 (https://forums.openharmony.cn/)
Powered by Discuz! X3.5