A Loading component for ReactJS.
JavaScript Other
Switch branches/tags
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Failed to load latest commit information.
demo
.gitignore
.npmignore
.travis.yml
LICENSE
README.md
index.js
package.json

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