I am not sure why this code works. Can someone explain?
File name : test.tsx
import { useState } from "react";
export const getComponents = () => {
const hello = [].map(() => {
const [state] = useState(0);
return {
b: "hello",
d: <div>{state}</div>,
};
});
return hello;
};
getComponents is not a React.isValidElement. Why am I able to use useState inside this function?
Codesandbox example : https://codesandbox.io/p/live/7f832aa1-c029-4083-98dd-c0068c502bc5
I would expect eslint to give me an error : ““react hooks must be called in a react function component or a custom react hook function”.”