I'm beginning to use Facebook React in a Backbone project and so far it's going really well.
However, I noticed some duplication creeping into my React code.
For example, I have several form-like widgets with states like INITIAL
, SENDING
and SENT
. When a button is pressed, the form needs to be validated, a request is made, and then state is updated. State is kept inside React this.state
of course, along with field values.
If these were Backbone views, I would have extracted a base class called FormView
but my impression was that React neither endorses nor supports subclassing to share view logic (correct me if I'm wrong).
I've seen two approaches to code reuse in React:
- Mixins (like LinkedStateMixin that ships with React);
- Container Components (such as react-infinite-scroll).
Am I correct that mixins and containers are preferred to inheritance in React? Is this a deliberate design decision? Would it make more sense to use a mixin or a container component for my “form widget” example from second paragraph?
Here's a gist with FeedbackWidget
and JoinWidget
in their current state. They have a similar structure, similar beginSend
method and will both need to have some validation support (not there yet).