使用fuse.js源码进行模糊搜索

介绍

fuse.js是无依赖的轻量级javascript工具

文档

源码地址:https://github.com/krisk/Fuse, example visit fusejs.io.

安装使用

方式一: 使用npm

方式二:使用cdn 引用cdn库

1
 <script src="https://cdn.bootcss.com/fuse.js/3.4.6/fuse.min.js"></script>

定义数据

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
    <script>
        var list = [
            {
                title: "Old Man's War",
                author: {
                    firstName: "John",
                    lastName: "Scalzi"
                }
            },
            {
                title: "The Lock Artist",
                author: {
                    firstName: "Steve",
                    lastName: "Hamilton"
                }
            },
            {
                title: "HTML5",
                author: {
                    firstName: "Remy",
                    lastName: "Sharp"
                }
            }
        ]
    </script>

使用函数

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
    <script>

        var options = {
            shouldSort: true,
            threshold: 0.6,
            location: 0,
            distance: 100,
            maxPatternLength: 32,
            minMatchCharLength: 1,
            keys: [
                "title",
                "author.firstName"
            ]
        };
        var fuse = new Fuse(list, options); // "list" is the item array
        var result = fuse.search("moor");
    </script>