createInjectionState

创建注入/提供状态对，实现父子组件间的状态共享。

函数签名

function createInjectionState<T>(
  composable: () => T
): [
  provide: () => T,
  inject: (defaultValue?: T) => T | undefined
]

参数

参数名	类型	必填	说明
composable	() => T	是	状态 composable 函数

返回值

类型	说明
[provide, inject]	返回元组：[提供函数, 注入函数]

工作原理

1. 创建唯一注入键：使用 Symbol 生成唯一标识

2. provide 函数（在父组件中调用）：

   • 执行 composable() 创建状态
   • 使用 Vue 的 provide(key, state) 提供状态
   • 返回状态（可选）

3. inject 函数（在子组件中调用）：

   • 使用 Vue 的 inject(key, defaultValue) 注入状态
   • 如果找不到状态且未提供 defaultValue，可能返回 undefined
   • 返回注入的状态

使用模式：

// 创建状态对
const [provideCount, injectCount] = createInjectionState(() => {
  const count = ref(0)
  return { count }
})

// 父组件
provideCount()

// 子组件
const { count } = injectCount()

基于 Vue 的 provide/inject 实现，提供类型安全的状态共享。