`Funcția createContext în React: Partajarea Datelor Globale prin Provider` în React & Next.js

Componente & API-uri Standard React 16.3+

Ghid complet pentru createContext în React: crearea depozitelor de context, distribuirea stărilor globale prin Provider și noutățile de consum din React 19.

Sintaxă

const ThemeContext = createContext(defaultValue);

Funcția createContext creează un canal de comunicare prin care datele pot fi distribuite în adâncimea arborelui de componente fără a fi pasate manual pas cu pas prin proprietăți intermediare (eliminând props drilling).

Definirea și furnizarea unui context de autentificare

import { createContext, useState, useContext } from 'react';

// 1. Creăm contextul cu o valoare implicită de siguranță:
export const AuthContext = createContext({
  utilizator: null,
  login: () => {},
  logout: () => {}
});

// 2. Creăm componenta furnizor (Provider):
export function AuthProvider({ children }) {
  const [utilizator, setUtilizator] = useState(null);

  const login = (date) => setUtilizator(date);
  const logout = () => setUtilizator(null);

  return (
    <AuthContext.Provider value={{ utilizator, login, logout }}>
      {children}
    </AuthContext.Provider>
  );
}

// 3. Hook personalizat pentru acces facil:
export const useAuth = () => useContext(AuthContext);