Indicates whether an item was created from a stateless functional component

Question

I own React Flip Move, a small library that helps animate transitions when reordering DOM nodes.

Works using links; I clone the supplied children and attach the ref function, which will give me access to the base node, and I use this link to imperatively revitalize as needed.

Stateless functional components do not support links. When he passed the SFC, he throws an exception.

The current error message is useless, and I would like to provide a clearer warning. The problem is that I do not know how to determine if a React element was created from SFC or not. Studying props.children , they look almost the same.

I can of course figure this out by wrapping the first call in try / catch, but I would like to be more explicit than that (also, I don't want to wait until the first animation attempt before launching a custom error message).

Answer 1

I don't know if this helps, but what do you think of it:

 class StatefulComponent extends React.Component {...} console.log(typeof StatefulComponent.prototype.isReactComponent); // logs 'object' const StatelessComponent = () => {...} console.log(typeof StatelessComponent.prototype.isReactComponent); // logs 'undefined' 

However, I will try React Flip Move ASAP. Good job!

EDIT:

So, if you want to find out if the children of your base component are a React component:

 // logs 'object' if it a React Component otherwise logs 'undefined' console.log(typeof this.props.children.type.prototype.isReactComponent);