Using ES6 classes for more idiomatic React?

[eugene1g]

Great draft!

Posit: this guide would have a longer lifespan if it shifted away from React.createClass and towards ES6 classes/components. My understanding is that React is rapidly moving towards a purely functional structure, and while using ES6 classes is only a midway step, it is still a step in the right direction.

[mikechau]

Thanks!

I plan to be adding the ES6 version as well. Probably after I finish Part 2. My application is still on 0.12.x, but I plan to update the document to have all new things from 0.13.

I will make a note that this guide is initially written for 0.12.x, but will definitely be updated for 0.13.

But if anyone wants to add ES6 examples feel free!

[eddyystop]

Using ES6 classes means you cannot currently use mixins and mixins are very useful. It should be possible to cobble together a way to use existing mixins in ES6 classes

[xmo-odoo]

It should be possible to cobble together a way to use existing mixins in ES6 classes

Unless React moves away from the existing mixins system entirely and towards higher-order components and class decorators instead which seems to be the case.

The React 0.13 release notes certainly seemed to say that mixins were a stopgap and that they'd be dropped (alongside React.createClass) when an equivalent solution is found using native structures, not that effort would be expended towards adding mixins to ES6 components:

Our eventual goal is for ES6 classes to replace React.createClass completely, but until we have a replacement for current mixin use cases and support for class property initializers in the language, we don't plan to deprecate React.createClass.

See also facebook/react#1380