useSynchronizer
The useSynchronizer primitive is used to get a reference to a Synchronizer object from within a Provider component context.
useSynchronizer(id?: MaybeAccessor<undefined | string>): Accessor<Synchronizer | undefined>| Type | Description | |
|---|---|---|
id? | MaybeAccessor<undefined | string> | An optional |
| returns | Accessor<Synchronizer | undefined> | A reference to the |
A Provider component is used to wrap part of an application in a context. It can contain a default Synchronizer object (or a set of Synchronizer objects named by Id) that can be easily accessed without having to be passed down as props through every component.
The useSynchronizer primitive lets you either get a reference to the default Synchronizer object (when called without a parameter), or one of the Synchronizer objects that are named by Id (when called with an Id parameter).
Example
This example creates the TinyBase objects needed by the Solid primitive or component and calls it from within a reactive root.
import {createRoot} from 'solid-js';
import {
createCheckpoints,
createIndexes,
createMetrics,
createQueries,
createRelationships,
createStore,
} from 'tinybase';
import {useSynchronizer} from 'tinybase/ui-solid';
createRoot((dispose) => {
const store = createStore()
.setTables({
pets: {
fido: {species: 'dog', color: 'brown', next: 'felix'},
felix: {species: 'cat', color: 'black'},
},
species: {dog: {price: 5}, cat: {price: 4}},
})
.setValues({open: true});
const metrics = createMetrics(store).setMetricDefinition(
'highestPrice',
'species',
'max',
'price',
);
const indexes = createIndexes(store).setIndexDefinition(
'bySpecies',
'pets',
'species',
);
const relationships = createRelationships(store)
.setRelationshipDefinition('petSpecies', 'pets', 'species', 'species')
.setRelationshipDefinition('nextPet', 'pets', 'pets', 'next');
const queries = createQueries(store).setQueryDefinition(
'petColors',
'pets',
({select, where, param}) => {
select('color');
where((getCell) => getCell('species') == param('species'));
},
{species: 'dog'},
);
const checkpoints = createCheckpoints(store);
store.setCell('pets', 'fido', 'color', 'walnut');
checkpoints.setCheckpoint('updated color');
metrics.getMetric('highestPrice');
indexes.getSliceIds('bySpecies');
relationships.getRemoteRowId('petSpecies', 'fido');
queries.getResultRowIds('petColors');
useSynchronizer();
dispose();
});
Since
v8.3.0