createContext

The createContext factory function is at the heart of all functionality in Vuetify0. It is a small wrapper around the Vue 3 provide↗ and inject↗ APIs, allowing you to create a context that can be shared across components.

Usage

import { shallowRef } from 'vue'
import { createContext } from '@vuetify/v0'
import type { ShallowRef } from 'vue'

interface MyContext {
  isDisabled: ShallowRef<boolean>
}

const [useContext, provideContext] = createContext<MyContext>('namespace')

provideContext({ isDisabled: shallowRef(false) })

export { useContext }

API

createContext

• Type

  type ContextKey<Z> = InjectionKey<Z> | string
  
  function createContext<Z> (key: ContextKey<Z>): [
    (namespace?: string) => Z,
    (context: Z, app?: App) => Z,
  ]

• Details

  Z represents the context interface, which defines the structure of the context object that will be created and consumed. namespace is an optional string that overrides the default provided key.

useContext

• Type

  function useContext<Z> (key: ContextKey<Z>) => Z

• Details

  A simple wrapper function for injecting context that always fallsback to undefined if not found. It throws an error if the context is not found, ensuring that the consumer is aware of the missing context.