useInjectionStore

v0.0.5testeddemo

Create a global state that can be injected into components

Examples

const { useProvidingState, useInjectedState } = useInjectionStore(() => ref('Hello World'));

// In a parent component
const state = useProvidingState();

// In a child component
const state = useInjectedState();

const { useProvidingState, useInjectedState } = useInjectionStore(() => ref('Hello World'), {
 injectionKey: 'MyState',
 defaultValue: 'Default Value'
});

// In a plugin
{
 install(app) {
  const state = useAppProvidingState(app)();
  state.value = 'Hello World';
 }
}

// In a component
const state = useInjectedState();

Demo

Loading demo…

Signature

export function useInjectionStore<Args extends any[], Return>(
  stateFactory: (...args: Args) => Return,
  options?: useInjectionStoreOptions<Return>,
){ ... }

Type Parameters

Argsextends any[]

Return

Parameters

Parameter	Type	Default	Description
`stateFactory`	`(...args: Args) => Return`	—	A factory function that creates the state
`options`?	`useInjectionStoreOptions<Return> \| undefined`	—	An object with the following properties

Returns

{ useProvidingState: (...args: Args) => Return; useAppProvidingState: (app: App) => (...args: Args) => Return; useInjectedState: () => Return & ({} | null); }

An object with `useProvidingState`, `useAppProvidingState`, and `useInjectedState` functions