How to use the fluxible.FluxibleMixin function in fluxible

To help you get started, we’ve selected a few fluxible examples, based on popular ways it is used in public projects.

Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.

github mderrick / webpack-react-boilerplate / app / components / layout / index / view.js View on Github external
var React = require('react'),
    css = require('./style.css'),
    Router = require('react-router'),
    getFollowers = require('./../../../actions/getFollowers'),
    FollowersStore = require('./../../../stores/FollowersStore'),
    FluxibleMixin = require('fluxible').FluxibleMixin,
    AlertComponent = require('components/common/alert'),
    LoadingComponent = require('components/common/loading');

var IndexComponent = React.createClass({

    mixins: [FluxibleMixin],

    statics: {
        storeListeners: [FollowersStore],
        // LoadAction is the action that the server needs to run to make
        // this component isomorphic.
        loadAction: getFollowers
    },

    classes: React.addons.classSet({
        'layout-content': true,
github mderrick / webpack-react-boilerplate / app / components / layout / user / view.js View on Github external
var React = require('react'),
    css = require('./style.css'),
    getUser = require('./../../../actions/getUser'),
    UserStore = require('./../../../stores/UserStore'),
    FluxibleMixin = require('fluxible').FluxibleMixin,
    AlertComponent = require('components/common/alert'),
    LoadingComponent = require('components/common/loading');

var UserComponent = React.createClass({

    mixins: [FluxibleMixin],

    statics: {
        storeListeners: [UserStore],
        // LoadAction is the action that the server needs to run to make
        // this component isomorphic.
        loadAction: getUser
    },
    
    classes: React.addons.classSet({
        'layout-content': true,
github alexaivars / isomorphic-react / app / components / routeHandlers / ViewTrack.jsx View on Github external
'use strict';

var React   = require('react');
var Router = require('react-router');
var FluxibleMixin	= require('fluxible').FluxibleMixin;
var SpotifyTrack =  require('../SpotifyTrack.jsx');
var LoadAction = require('../../actions/LoadTrack');

module.exports = React.createClass({
  displayName: 'ViewTrack',
  mixins: [FluxibleMixin],
  statics: {
    loadAction: LoadAction,
    storeListeners: ['DataStore']
  },
	componentWillMount: function() {
		this.props.context.executeAction(LoadAction, {params:this.props.params, query: this.props.query});
	},
	
  render: function() {
    var store = this.props.context.getStore('DataStore');
github diplomatiegouvfr / hornet-js / hornet-js-core / src / mixins / react-mixins.ts View on Github external
var lodashArrays = require("lodash/array");
var logger = utils.getLogger("hornet-js-core.mixin.react-mixins");

require("react-safe-render")(React, {
    errorHandler: function (errReport) {
        logger.error(`Error|${errReport.displayName}|${errReport.method}| ${errReport.error}`, errReport);
    }
});

var loggerPropsMixin = utils.getLogger("hornet-js-core.mixin.react-props-mixins");

var _ = utils._;

import PageInformationsStore = require("src/stores/page-informations-store");

export var FluxibleMixin = require("fluxible").FluxibleMixin;

var hornetContextMixin = {
    propTypes: {
        context: React.PropTypes.object
    },
    getHornetContext() {
        return this.props.context || this.context;
    }
};

var themeMixin = {
    genUrlTheme: function (path) {
        var themeUrl = this.getHornetContext().getStore(PageInformationsStore).getThemeUrl();
        return themeUrl + (path === undefined ? "" : path);
    }
};
github mderrick / webpack-react-boilerplate / app / components / layout / view.js View on Github external
var React = require('react'),
    Router = require('react-router'),
    css = require('./style.css'),
    FluxibleMixin = require('fluxible').FluxibleMixin;

var View = React.createClass({
    
    mixins: [FluxibleMixin],

    classes: React.addons.classSet({
        'layout': true
    }),

    render: function () {
        return (
            <div>
                <h1>Webpack React Boilerplate</h1>
                <ul>
                    <li>
                        </li></ul></div>
github alexaivars / isomorphic-react / app / components / routeHandlers / app.jsx View on Github external
'use strict';

var React   = require('react'),
    Router = require('react-router'),
    RouteHandler = Router.RouteHandler,
    FluxibleComponent = require('fluxible').FluxibleComponent,
    FluxibleMixin = require('fluxible').FluxibleMixin,
    RouterPropTypes = require('react-router/lib/PropTypes');

module.exports = React.createClass({
  mixins: [FluxibleMixin],
  displayName: 'AppHandler',
  contextTypes: {
    router: RouterPropTypes.router.isRequired
  },
  statics: {
    storeListeners: ['DataStore']
  },
  onChange: function () {
	  var query = this.getStore('DataStore').getQuery();
    this.context.router.replaceWith(this.props.pathname, null, query);
  },
  render: function() {
github alexaivars / isomorphic-react / app / components / routeHandlers / SearchTrack.jsx View on Github external
'use strict';

var React   = require('react');
var Router = require('react-router');
var SpotifySearch = require('../SpotifySearch.jsx');
var SpotifyMessage = require('../SpotifyMessage.jsx');
var SpotifyListTracks = require('../SpotifyListTracks.jsx');
var LoadAction = require('../../actions/LoadSearch');
var FluxibleMixin	= require('fluxible').FluxibleMixin;

module.exports = React.createClass({
  displayName: 'ViewTrack',
  mixins: [FluxibleMixin],
  statics: {
    loadAction: LoadAction,
    storeListeners: ['DataStore']
  },
  /**
   * Event handler for 'change' events coming from the stores
   */
  onChange: function() {
    this.forceUpdate();
  },
	
	componentWillMount: function() {