react-page-visibility-render-props

Simple react wrapper for the pagevisibility.js package, using render props for better composability.

TODO: Complete the readme.

Install

npm install --save react-page-visibility-render-props

Usage

Just pass a function as a child of the <PageVisibility> component. This function should have a single parameter, which can be visible | hidden | prerender (check here for full description).

import React, { Component } from 'react'
 
import PageVisibility from 'react-page-visibility-render-props'
 
class Example extends Component {
  render () {
    return (
        <PageVisibility>
            {(pageVisibilityState) => {
                return (
                    <div>Page is { pageVisibilityState } so will act accordingly</div>
                )
            }}
        </PageVisibility>
    )
  }
}

License

MIT © António Capelo