你如何键入一个作为道具传递给组件的 useState 钩子，typescript + react

Question

I have two components and

Now I'm passing a useState hook from Admin component into the Login component as a setAuth prop

In my Admin component:

const Admin = () => {
  const [auth, setAuth] = useState(false);

  <Login setAuth={setAuth} />
}

And my Login component:

const Login = ({ setAuth }) => {
  //and then logic to set auth based on db auth from firebase
  setAuth(true)
}

How do I properly type the setState hook being passed as a prop to a component?

Answer 1

interface ISetAuth {
  setAuth: Dispatch<SetStateAction<boolean>>;
}

const Login = ({ setAuth }: ISetAuth) => {
  //whatever code
}