react-props-provider

react-props-provider

  import React from 'react'
  import { PropsProvider, PropsConsumer } from 'react-props-provider'

  let ExampleComponent = (props) => (
    <div>hello {props.name}</div>
  );
  ExampleComponent = PropsConsumer(ExampleComponent);

  let ExampleParent = (props) => (
    <ExampleComponent />
  );
  ExampleParent = PropsProvider(ExampleParent);

  // will render to <div>hello bob</div>
  let a = (<ExampleParent name="bob" />);

API

react-props-provider : object

Kind: global namespace

• react-props-provider : object
  • .PropsConsumer(reactClass, propsFromContext) ⇒
  • .PropsProvider(reactClass, propsToContext) ⇒

react-props-provider.PropsConsumer(reactClass, propsFromContext) ⇒

  import React from 'react'
  import { PropsConsumer } from 'react-props-provider'

  // an example component
  let ExampleComponent = (props) => (
    <div>{props.name}</div>
  );

  ExampleComponent = PropsConsumer(ExampleComponent);

  // name will always be bob, since the prop is defined directly
  let a = (<ExampleComponent name="bob" />);

  // if 'name' was provided by a parent component, it would be used
  let b = (<ExampleComponent />);

PropsConsumer is a React HOC that wraps a React class, and returns a new React class that uses the props-provider context to provide default props to the wrapped component

Kind: static method of react-props-provider
Returns: a wrapped react class
Params

• reactClass - the react class / function to wrap with a prop.
• propsFromContext function - an optional function to customize which context props you want to consume.

react-props-provider.PropsProvider(reactClass, propsToContext) ⇒

  import React from 'react'
  import { PropsProvider } from 'react-props-provider'

  // an example component
  let ExampleComponent = (props) => (
    <div>{props.name}</div>
  );

  ExampleComponent = PropsProvider(ExampleComponent);

  // ExampleComponent will provide 'name' as a contextual prop to any children
  let a = (<ExampleComponent name="bob" />);

PropsConsumer is a React HOC that wraps a React class, and returns a new React class that uses the props-provider context to provide default props to the wrapped component

Kind: static method of react-props-provider
Returns: a wrapped react class
Params

• reactClass - the react class / function to wrap with a prop.
• propsToContext function - an optional function to customize which props are provided.