I was looking through a .tsx code that looked something like below.
import React, { Fragment, ReactFragment } from "react";
// ...
export interface PageProps {
children: ReactFragment;
commandBar: reactFragment;
// ...
}
export default page(props: PageProps) {
return(
<Fragment>
// ...
</Fragment>
);
}
I roughly know what a React.Fragment is.
We can use either <></> or <React.Fragment></React.Fragment> or <Fragment></Fragment> based on the import sugaring, to group react elements.
So, my question is how does ReactFragment work here?
Is it just to indicate that children or commandBar is of a React.Fragment type?
In that case, why not use React.Fragment itself?
Googling throwed results for React.Fragment only.
Is it just to indicate that
childrenorcommandBaris of aReact.Fragmenttype?
Yes.
In that case, why not use
React.Fragmentitself?
React.Fragment is not a type but a value. If you used it, you will see an compile error like this:
'Fragment' refers to a value, but is being used as a type here.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With