0.1.1 • Published 9 years ago
react-contexter v0.1.1
React contexter
Use context with Higher Order Components for better testing and reuse.
The logic is simple: put the context
you want as props
.
import contexter from 'react-contexter';
function MyComponent({ fromParent }) {
return <button onClick={ fromParent }>Click Me!</button>;
};
var ContextedComponent = contexter({
fromParent: React.PropTypes.func.isRequired,
}, MyComponent);
And that's it. MyComponent
can be tester with your favorite testing tools, just inject the right prop
and you're ready to go.
Install
just npm install --save react-contexter
as you normally do.
API
createContexter(contextTypes)
creates a wrapper function for creating context containers:
import { createContexter } from 'react-contexter';
var contexter = createContexter({
fromParent: React.PropTypes.func.isRequired,
});
var ContextedComponentOne = contexter(ComponentOne);
var ContextedComponentTwo = contexter(ComponentTwo);
this can help you creating custom utility functions for your applications.
contexter(contextTypes, Component)
creates a contexter that injects contextTypes
and executes it with Component
.
import contexter from 'react-contexter';
function MyComponent({ fromParent }) {
return <button onClick={ fromParent }>Click Me!</button>;
};
var ContextedComponent = contexter({
fromParent: React.PropTypes.func.isRequired,
}, MyComponent);