React: “Используйте createStateContext для совместного использования хука useS…”

Используйте createStateContext для совместного использования хука useState

Несмотря на то, что многие превозносят UseContext в React как решение для управления состоянием, на самом деле он не имеет никакого отношения к управлению состоянием.

React Context - это инъекция зависимостей. Вы предоставляете значение компоненту-обертке, а затем любой последующий компонент может использовать это значение через хук useContext.

import React, { useContext } from "react"
export function createStateContext<T>() {
  const StateContext = React.createContext<
    | undefined
    | Readonly<[T, React.Dispatch<React.SetStateAction<T>>]>
  >(undefined)
  function useStateContext() {
    const tuple = useContext(StateContext)
    if (tuple === undefined) {
      throw new Error(
        `use${StateContext.displayName} must be used within a ${StateContext.displayName}Provider`,
      )
    }
    return tuple
  }
  return [StateContext, useStateContext] as const
}

https://www.jacobparis.com/content/use-state-context

✍️ @React_lib