Any recommendations for a spinner to use with React apps?

  • Would prefer to not use the Sacha: spin package since that would require wrapping in Blaze.
  • Tried using this package that wraps spin.js, however it uses the Meteor react package which I do not want to do.
  • Tried the react-spinner npm package but it does not seem to provide a basic spinner out of the box.

Obviously, I can just roll my own, but wanted to first see what others are doing. Any recommendations would be appreciated!

Are you importing the CSS file from react-spinner? It won’t be imported automatically for you and therefore you won’t be able to see it.

Yup, importing the styles and also wrapping the <Spinner /> in a div block with some custom styling as per the example. Without that, couldn’t get anything to show up.

Ended up going with this: http://projects.lukehaas.me/css-loaders/


import React from 'react'
import './loading.css'

export const Loader = () => <div className="loader">Loading...</div>

Done!

(And you get a nice fallback msg for screen readers etc.)

3 Likes