react-body

React component that conditionally adds CSS class name(s) to document.body

---

🔥 Want to strengthen your core JavaScript skills and master ES6 and React?
I would personally recommend this awesome ES6 and React courses by Wes Bos.

---

How to Install

$ npm install react-body --save

How to Use

<ReactBody className=<CSS-CLASS-NAME> if=<CONDITION> />

..where <CSS-CLASS-NAME> is the CSS class name(s) that must be appended to document.body when component is rendered and <CONDITION> is a true (defualt) or false flag indicating if document.body should actually be altered.

For example:

import React from 'react';
import ReactBody from 'react-body';
 
class MyComponent extends React.Component {
 
  static defaultProps = {
    inverted: false,
  };
 
  static propTypes = {
    inverted: React.PropTypes.bool.isRequired,
  };
 
  render() {
    return (
      <div>
        <ReactBody className="inverted" if={this.props.inverted} />
        <h1>Hello, world!</h1>
      </div>
    );
  }
}
 
export default MyComponent;

License

The MIT License © 2016-present Konstantin Tarkus (@koistya). All rights reserved.