Creé una aplicación de reacción usando yarn create react-app app-name --template typescript , aquí está mi código
Proveedor de autenticación.tsx
import { createContext, useState } from "react"; const AuthContext = createContext({ }); export const AuthProvider = ({ children }: any) => { const [auth, setAuth] = useState({}); return ( <AuthContext.Provider value={{ auth, setAuth }}> {children} </AuthContext.Provider> ); }; export default AuthContext;Inicio de sesión.tsx
import React, { useContext, useEffect, useRef, useState } from "react"; import AuthContext from "./context/AuthProvider"; const Login = () => { const { setAuth } = useContext(AuthContext); /*codes here*/ return <></>; }; export default Login; El error es que Property 'setAuth' does not exist on type '{}'.ts(2339) , pero cuando cambio la extensión del archivo a .js , no muestra el error. ¿Que me estoy perdiendo aqui?
Debe definir el tipo de AuthContext :
interface Auth { // properties of auth object you're using in const [auth, setAuth] = useState({}); }; const AuthContext = createContext<{ auth?: Auth, setAuth?: (auth: Auth) => void }>({ }); Ajuste la Auth y el tipo de contexto según sea necesario para que coincida con sus requisitos.
Sin pasar un tipo a useContext , TypeScript lo infiere del valor inicial pasado al enlace, que es {} , y no tiene ninguna de las propiedades que le estás pasando más adelante en el proveedor.