Using create-react-class in your React apps

Using create-react-class in your React apps

In React 16, Facebook are deprecating the React.createClass() syntax for creating new components, preferring the new ES6 class method. Already from React 15.5.0, they start reminding you about this.

They favour replacing

[code language=”javascript”]var Greeting = React.createClass ();
[/code]

with

[code language=”javascript”]class Greeting extends React.Component {}
[/code]

You should absolutely upgrade to the new ES6 way but that involves some refactoring other parts of the app so if you just want the warnings to go away for now, you need to install the create-react-class npm module and then swap out the parts of your code where it says React.createClass for createReactClass. As they say, it really is a drop-in replacement.
Step 1.

[code language=”bash”]$ yarn add create-react-class[/code]

or

[code language=”bash”]$ npm install create-react-class —save
[/code]

 

Step 2.

Old code

[code language=”javascript”]var MyComponent = React.createClass(….
[/code]

New Code (remember to import the module)

[code language=”javascript”]import createReactClass from ‘create-react-class’;[/code]

[code language=”javascript”]var MyComponent = createReactClass({
[/code]
Very simple but not clearly documented anywhere I could find.

Leave a Reply

Your email address will not be published. Required fields are marked *