vue 模糊查询插件_用于模糊搜索库的Vue.js插件

vue 模糊查询插件

保险丝 (vue-fuse)

A Vue.js pluggin for fuzzy search library, Fuse.js There are two ways to use this plugin. The vue-fuse component, or the $search method. Be sure to take a look at the documentation for both below.

用于模糊搜索库的Vue.js插件Fuse.js有两种使用该插件的方法。 vue-fuse组件或$ search方法。 确保查看下面两个文档。

安装 (Install)

npm install vue-fuse

yarn add vue-fuse

In main.js

在main.js中

import VueFuse from 'vue-fuse'

Vue.use(VueFuse)

完整的Fuse.js文档 (Full Fuse.js Documentation)

This is just a simple drop in component leverage Fuse.js. For complete documentation, check out http://fusejs.io/

这只是组件利用Fuse.js的简单下降。 有关完整的文档，请访问http://fusejs.io/

$搜索方法 ($search Method)

The $search instance method allows you to execute a search programmatically within your application. Calling the this.$search function will return a promise, that is fulfilled once Fuse.js returns completes the search. $search takes the following params:

$search实例方法使您可以在应用程序中以编程方式执行搜索。 调用this.$search函数将返回一个诺言，一旦Fuse.js返回完成搜索，该诺言就会实现。 $search采用以下参数：

• term - (required) the search term or query that you will search by

  term -(必填)您要搜索的搜索字词或查询

• list - (required) an array of items to search

  list -(必填)要搜索的项目数组

• options - (required) an object with fuse.js options. At minimum, you must provide an array of keys. Other options will default to the fuse.js defaults (see here: http://fusejs.io/)

  options (必需)带有fuse.js选项的对象。 至少必须提供一个keys数组。 其他选项将默认为fuse.js的默认值(请参见此处： http ://fusejs.io/)

$ search例子 ($search example)

this.$search(this.term, this.bikes, this.options).then(results => {
  this.searchResults = results
})

Vue-Fuse组件 (vue-fuse Component)

The vue-fuse component can be added any of your existing Vue components. It creates an input html element, and takes props (listed below) to execute a search. Search results are then returned via events.

可以将vue-fuse组件添加到任何现有的Vue组件中。 它创建一个input html元素，并使用props(下面列出)来执行搜索。 然后通过事件返回搜索结果。

现场演示 (Live Demo)

https://vue-fuse.firebaseapp.com/

https://vue-fuse.firebaseapp.com/

翻译自: https://vuejsexamples.com/a-vue-js-pluggin-for-fuzzy-search-library/

vue 模糊查询插件