I have a table component that receives an array of string/number arrays as a prop, so it takes a rows parameter typed like this:
type Row = (string | number)[];
However, some columns need to display a React component instead of a plain text / number.
How can I change the typings to make it work? I tried this:
type Row = (string | number | React.PureComponent | React.Component)[];
There are many options here that would work, some better than others depending on how you use them. I've been using React.ReactNode for specifying children, but you could probably use it for your use-case too.
type Row = (string | number | React.ReactNode)[];
ReactNode is quite flexible, since it is defined as:
type ReactNode = ReactChild | ReactFragment | ReactPortal | boolean | null | undefined;
and ReactChild in turn, is defined as: type ReactChild = ReactElement | ReactText;
If you want it stricter, less flexible, try ReactElement.
