A Loading component for ReactJS.
JavaScript Other
Switch branches/tags
Permalink
Failed to load latest commit information.
demo Move example to /demo May 9, 2015
.gitignore Clean up, remove /dist May 7, 2015
.npmignore Update npm ignore May 10, 2015
.travis.yml Initial Commit May 7, 2015
LICENSE Add license May 7, 2015
README.md Add demo link to README May 9, 2015
index.js Grab className from props May 8, 2015
package.json Update version May 10, 2015

README.md

Reloading

npm version Build Status

A Loading component for React.

Demo

Installation

npm install --save reloading

Usage

var React = require('react');
var Loading = require('reloading');

var App = React.createClass({
  getInitialState: function () {
    return {
      loading: false
    };
  },

  doRequest: function () {
    this.setState({
      loading: true
    });
  },

  completeRequest: function () {
    this.setState({
      loading: false
    });
  },

  render: function() {
    return (
      <div>
        Hello, world! I am a React Loading Component.
        <Loading shouldShow={this.state.loading} />
      </div>
    );
  }
});

Properties

Custom Content
<Loading shouldShow={this.state.loading}>Your content - images, text, whatever!</Loading>
Loading Text
<Loading shouldShow={this.state.loading} text='Checking your details...' />
CSS Class
<Loading shouldShow={this.state.loading} className='loading-wrapper' />
Font Awesome Icon
<Loading shouldShow={this.state.loading} faIcon='fa fa-refresh fa-spin' />

Development

Install http-server from npm, run it and go to http://127.0.0.1:8080/

npm install -g http-server
npm run serve

In another tab:

npm run watch