I can't create context with typescript react-CodePudding

if I use .js instead of .tsx there is no problem. but when I use typescript, it shows this error "Expected 1 arguments, but got 0.". what am I missing ?

context.tsx


import { createContext, useContext} from "react";

const MainContext = createContext();

export {
    MainContext,
    useContext
}

Layout.tsx

const LayoutComponent = ({children}: any) => {

   const [email, setEmail] = useState("");

 const data = {
   email,
   setEmail
 }

  return (
     <MainContext.Provider value={data}>
      <Header />
      {children}
     </MainContext.Provider>
  );
}

CodePudding user response：

use default value

import { createContext, useContext} from "react";

const ctx = createContext({ someData: true })

export const useCtx = () => useContext(ctx)

CodePudding user response：

createContext needs a default value

const MainContext = createContext({});