Client side render method, takes care of preparing the context for rendering and rendering it into the provided container.

Options

Accepts all options from getPageContext in addition to the options outlined below.

NameTypeRequiredDescription
containerDOMElementYESThe dom element in which the context should be rendered into.

Example Usage

// bootstrap adds all stores, actions and routes
require('./bootstrap');

var React = require('react');
var fluxApp = require('fluxapp');

var appElement = document.getElementById('app');

var context = fluxApp.createContext();

// id or url path
context.render('page-id');

With fluxapp-router plugin and isomorphic rendering

// bootstrap adds all stores, actions and routes
require('./bootstrap');

var React = require('react');
var fluxApp = require('fluxapp');

// state passed down from server
var serverState = window.fluxAppState;

var appElement = document.getElementById('app');

var context = fluxApp.createContext();

var routerActions = context.getRouterActions();

context.registerRouteHandler(function routeHandler(request) {
  var isFirstRequest = ! request.lastRequest;
  var options = {};

  if (isFirstRequest) {
    options.state = serverState.state,
  }

  options.container = appElement;

  context.render(request, options);
});

routerActions.init(window.location.href, {
  method: serverState.method
});

👍

On to renderToString