https://github.com/lonelyclick/react-loading-bar

React Loading Bar
https://github.com/lonelyclick/react-loading-bar

react react-loading react-loading-bar react-progress-bar

Last synced: 5 days ago
JSON representation

React Loading Bar

• Host: GitHub
• URL: https://github.com/lonelyclick/react-loading-bar
• Owner: lonelyclick
• Created: 2015-11-24T09:39:24.000Z (about 10 years ago)
• Default Branch: master
• Last Pushed: 2020-10-09T13:09:27.000Z (over 5 years ago)
• Last Synced: 2025-09-19T23:07:31.706Z (4 months ago)
• Topics: react, react-loading, react-loading-bar, react-progress-bar
• Language: JavaScript
• Homepage: http://lonelyclick.github.io/examples/loadingbar.html
• Size: 271 KB
• Stars: 50
• Watchers: 1
• Forks: 13
• Open Issues: 1
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

          
# React Loading Bar

[![Build Status](https://travis-ci.org/lonelyclick/react-loading-bar.svg?branch=master)](https://travis-ci.org/lonelyclick/react-loading-bar)

## Usage

```

  npm install react-loading-bar --save

```

```

import React, { Component } from 'react'

import Loading from 'react-loading-bar'

import 'react-loading-bar/dist/index.css'

export default class LoadingExample extends Component {

  state = {

    show: false

  }

  onShow = ()=> {

    this.setState({ show: true })

  }

  onHide = ()=> {

    this.setState({ show: false })

  }

  render() {

    return (

      


        


        

          show

        

        

          hide

        

      

    )

  }

}

```


Support UMD

## Demo

[React Loading Bar Example](http://lonelyclick.github.io/examples/loadingbar.html "react-loading-bar")

## Option Change

```

```

If change set `false`, will do nothing, default `true`

## License

MIT