Vuex ORM Search plugin adds a search()
query chain modifier to easily filter matched records using fuzzy search logic from the Fuse.js library.
A simple example to search for 'john' within your query:
const users = User.query().search('john').get()
Vuex ORM is sponsored by awesome folks. Big love to all of them from whole Vuex ORM community 💕
Install @vuex-orm/plugin-search
alongside Vuex ORM.
npm install @vuex-orm/core @vuex-orm/plugin-search --save # OR yarn add @vuex-orm/core @vuex-orm/plugin-search
Then install the plugin using Vuex ORM use()
method.
import VuexORM from '@vuex-orm/core' import VuexORMSearch from '@vuex-orm/plugin-search' VuexORM.use(VuexORMSearch, { // Configure default fuse.js options here (see "Configuration" section below). })
The search plugin method accepts two parameters.
search(terms: string | string[], options: Object): Query
terms
– any string or an array of strings.options
– see the Configurations section below.NOTE: If passing an array of search terms, the results assume some element in the array to be matched.
The plugin provides opinionated default Fuse.js options for token-based matching for optimum performance. These options can be easily changed at two stages of the plugin lifecycle:
See: Fuse.js for demo.
Property Description Default searchPrimaryKey Also search the primary keyfalse
location Approximately where in the text is the pattern expected to be found 0
distance Determines how close the match must be to the fuzzy location 100
threshold 0.0 requires a perfect match, and a threshold of 1.0 would match anything 0.3
maxPatternLength Machine word size 32
caseSensitive Indicates whether comparisons should be case sensitive false
tokenSeparator Regex used to separate words when searching. Only applicable when tokenize is true / +/g
findAllMatches When true, the algorithm continues searching to even if a perfect match is found false
minMatchCharLength Minimum number of characters that must be matched before a result is considered a match 1
keys An array of fields (columns) to be included in the search Keys from Model.fields()
shouldSort Whether to sort the result list, by score false
tokenize When true, the search algorithm will search individual words and the full string, computing the final score as a function of both. NOTE: that when tokenize is true, the threshold, distance, and location are inconsequential for individual tokens false
matchAllTokens When true, the result set will only include records that match all tokens. Will only work if tokenize is also true. NOTE: It is better to use multiple .search() query chains if you have multiple terms that need to match. false
verbose Will print to the console. Useful for debugging. false
Here are some examples on how to use the search plugin with case specific options.
For example, if we want to match based on case sensitive and no fuzzy search logic (perfect match).
VuexORM.use(VuexORMSearch, { caseSensitive: true, threshold: 0 })
The global install options will now default to case sensitive and no fuzzy logic, but for example we have a run-time case we need to ignore case and implement a slightly more strict fuzzy search threshold.
Let's also specify the need to only search the firstName
and lastName
fields.
const users = User.query().search('john', { caseSensitive: false, threshold: 0.3, keys: ['firstName', 'lastName'] }).get()Finding Results Matching Multiple Terms
Let's find all matches where both pat
and male
exist in our records, and sort by the date added.
const data = User.query().search(['pat', 'male'], { keys: ['firstName', 'gender'] }).get()
Join us on our Slack Channel for any questions and discussions.
Although there is the Slack Channel, do not hesitate to open an issue for any question you might have. We're always more than happy to hear any feedback, and we don't care what kind of form they are.
Vuex ORM can be extended via plugins to add additional features. Here is a list of available plugins.
We are excited that you are interested in contributing to Vuex ORM Plugin: Search! Anything from raising an issue, submitting an idea of a new feature, or making a pull request is welcome! Before submitting your contribution though, please make sure to take a moment and read through the following guidelines.
When submitting a new pull request, please make sure to follow these guidelines:
dev
branch, and merge back against dev
branch.master
branch, and merge back against master
branch.These rules also apply to the documentation. If you're submitting documentation about a new feature that isn't released yet, you must checkout the dev
branch, but for non-functional updates, such as fixing a typo, you may checkout and commit to the master
branch.
There are several scripts to help with development.
Compile files and generate bundles in dist
directory.
Lint files using Prettier.
Run the test using Jest.
Run the test in watch mode.
Generate test coverage in coverage
directory.
Vuex ORM Plugin: Search is open-sourced software licensed under the MIT license.
RetroSearch is an open source project built by @garambo | Open a GitHub Issue
Search and Browse the WWW like it's 1997 | Search results from DuckDuckGo
HTML:
3.2
| Encoding:
UTF-8
| Version:
0.7.4