@drawbotics/use-filters
v1.0.0
Published
Hook to manage filters and keep them in sync with the url
Downloads
7
Keywords
Readme
Use Filters
Hook to read/set filter values from/in the url.
Installation
$ npm i @drawbotics/use-filters
Usage
TypeScript
import { useFilters } from '@drawbotics/use-filters';
interface Filters {
filterKey: string;
filterKey2: 'one-value' | 'another-value';
}
// ... inside a component ...
const { filterKey, filterKey2 } = useFilter<Filters>(
history,
['filterKey', 'filterKey2'],
(key, value) => `Updated ${key} with ${value}`,
);
// read a filter value
console.log(filterKey.value); // => filterValue
// or an array value
console.log(filterKey.values); // => [filterValue]
// set a value
filterKey.set('newValue');
JavaScript
import { useFilters } from '@drawbotics/use-filters';
// ... inside a component ...
const { filterKey, filterKey2 } = useFilter(
history,
['filterKey', 'filterKey2'],
(key, value) => `Updated ${key} with ${value}`,
);
// read a filter value
console.log(filterKey.value); // => filterValue
// or an array value
console.log(filterKey.values); // => [filterValue]
// set a value
filterKey.set('newValue');