Define non-arrow React functional component for TypeScript?

Question

You can define a React functional component\'s types in TypeScript with this:

export const Component: React.FC = () => {
  return // Stuff
};
         


        

Answer 1

If you want to use the full type of a function to type a non-arrow function, you can use something like this (typescript documentation) :

let myAdd: (x: number, y: number) => number =
    function(x: number, y: number): number { return x + y; };

In your case:

const MyComponent: React.FC = function() {
  return 
;
};