After reading this, I'm on board, however it doesn't get into passing methods from the parent class. In my mixins right now I have a lot of helper functions that are used across the various components that use the mixin.
I would simply do something like below, unless someone has a better approach? Note I have anywhere from half a dozen to a dozen of these helper functions, so I'm just wondering if someone has a better approach than this, for example, if I could pass all the existing methods in one fell swoop instead of explicitly specifying each one.
## PARENT COMPONENT THAT I WOULD REPLACE MY MIXIN WITH
TableBase = (Component) ->
Table = React.createClass
isTableEmpty: ->
@props.items.length is 0
getStateBy: ->
if @props.state is 'active'
return <p>This is active</p>
if @props.state is 'inactive'
return <p>This is no longer active.</p>
render: ->
return (
<Component
{...@props}
{...@state}
isTableEmpty={@isTableEmpty}
getStateBy={@getStateBy}
..etc
/>
)
module.exports = TableBase
## EXAMPLE USING IT WITH ONE OF MY TABLES
UsersTable = React.createClass
render: ->
## and access my functions and props here...
if @props.isTableEmpty()
return <EmptyTableMsg msg='No items to show' />
return (
<Table striped>
## etc.
</Table>
)
buildUsersTable = TableBase(UsersTable)
module.exports = buildRacksTable
