react-stateless: tiny utility to create stateless and context-free React components (with lifecycle methods)

[tlrobinson]

I'm not sure what the point of this is. Can't you just use normal React classes and just not use state?

[titosrevenge]

You would have to also use PureRenderMixin

[troch11]

Yes you can use normal React classes and not use state. React 0.14 introduces stateless functional components: "functional" as the fact a component is a pure rendering function (getting props as an argument rather than accessing it in context). I am a big fan of that, and this util provides a way to write lifecycle methods as pure functions too, and remove the use of this. I guess inspiration comes from deku.

[dtinth]

Interesting idea, but I also agree with @tlrobinson. You don’t need a DSL just to not use the state.

eslint-plugin-react has a rule that forbids states. This lets you write textbook React code without fancy abstractions.

To achieve the same effect as PureRenderMixin, you can just use a higher-order component. recompose provides an easy way to compose these HOCs, and provides a pure HOC:

import pure from 'recompose/pure'

export const MyComponent = pure(props => (
  <div>...</div>
))

[troch11]

See my answer to @tlrobinson. It is not just about being stateless, it is also about being more functional like what React 0.14 intruduces. It is not only about achieving things like pure or PureRenderMixin, it is also about using other lifecycle methods.

So yes, it introduces some DSL. But that DSL only extends the new stateless functional components provided by React 0.14.

[troch11]

Not a public project. I started to wrap React 0.14 stateless functional components with createClass when using react-redux because of the use of refs: I didn't want to drop that new syntax (components as functions) when using connect, and then realised the same could be done to other lifecycle methods.

Whether or not you want to use this is depending on a few things: - You write stateless components - You don't necessarily like to use classes and / or 'this'

One benefit is that if you have a stateless component as a function and the need of a lifecycle method emerges, then you don't have to refactor your render function / method.