What classifies as a React functional component?
Any function which takes props as an argument can be classified as a functional component?
No, props is just the function argument, like all other normal function arguments. So if we define any function that accepts an argument it will not necessarily be a React functional component, like this is not a React component:
const Testing = props => {
const a = 10;
return a * props.a;
}
The important part is "If that component returns a React element", only then will it be a React functional component.
To make it more clear just define the below function in a separate file; it will not throw any error when you transpile:
const Test = props => props.key * 10;
But if you define this below component in a separate file without importing React, it will throw error, React is not defined, when you transpile:
const Test = props => <div>{props.key * 10}</div>;
Because JSX will get converted into React.createElement(....)
and React will be required. The converted version of the above component will be:
var Test = function Test(props) {
return React.createElement(
"div",
null,
props.key * 10
);
};
I will suggest, use Babel REPL and define both the functions and check the output.