Is mixin dead yet?

Design
7

Components.

This may be hard to understand without first un-learning inheritance (Mixins are inheritance).

Ember component yield with block params is a very powerful concept. The same concept exists in Angular and React as well, but they go by different names. If functional programming is about passing functions into functions, then component programming is about passing components into components. Also, components and helpers are pretty much the same thing. In fact, the new module unification RFC stop making distinction between the two.

Keep in mind, your component doesn’t have to actually render anything. You can use it as an abstraction. If you’re bothered by the extra div tag, set the component’s tagName: ''.

A few example of refactoring @workmanw’s mixins into components.

{{#window-resize as |width height|}}
  {{components width height}}
{{/window-resize}}

{{#image-load as |state|}}
  {{#if state.isPending}}
    Pending!
  {{else if state.isRejected}}
    Error!
  {{else}}
    Loaded!
  {{/if}}
{{/image}}

{{#realtime channel="..." as |stream|}}
  {{steam}} message!
{{/realtime}}
2 Likes