FluxibleComponent #
import FluxibleComponent from 'fluxible-addons-react/FluxibleComponent';
The FluxibleComponent
is a wrapper component that will provide all of its children with access to the Fluxible component
context via React's childContextTypes
and getChildContext
. This should be used to wrap your top level component. It provides access to the methods on the component context.
You can get access to these methods by setting the correct contextTypes
within your component or including the FluxibleMixin
which will add them for you.
Usage #
If you have a component that needs access to the ComponentContext
methods:
class Component extends React.Component {
constructor(props) {
super(props);
this.state = this.context.getStore(FooStore).getState();
}
}
Component.contextTypes = {
getStore: PropTypes.func.isRequired,
executeAction: PropTypes.func.isRequired
};
you can wrap the component with FluxibleComponent
to provide the correct context:
let html = ReactDOM.renderToString(
<FluxibleComponent context={context.getComponentContext()}>
<Component />
</FluxibleComponent>
);
If you are using createElementWithContext
this will happen for you automatically:
let html = ReactDOM.renderToString(createElementWithContext(context));