Share your code. npm Orgs help your team discover, share, and reuse code. Create a free org »

    react-mini-thispublic

    react-mini-this Build Status

    Create react components as pure functions with function bind syntax

    Install

    $ npm install --save react-mini-this
    

    Usage

    var React = require('react');
    var mini = require('react-mini-this');
    var pure = require('react-mini-this/pure');
     
     
    module.exports = (
      props => <h1>Title: {props.title}</h1> 
    )::mini();
     
    module.exports = (
      { title } => <h1>Title: {title}</h1> 
    )::pure();

    with props and state

     
    const Counter = function ( ({ step = 1 } , { setState, state: { count } }) { 
        var incCounter = () => setState({ count : count + step });
     
      return <span>Counter: {count}<button onClick={incCounter}>+1</button></span> 
    }::mini( { count: 10 });
     
    React.render(
      <Counter step={10}/>,
      document.body
    )

    API

    (render:Function(props, component))::mini([initialState:Object])

    • render : This is the actual render function.
      • props:Object : The props of the component
      • component:Object : The component (this)
    • initialState : The initial state of the component.

    Related

    :: huh?

    If you’re wondering what the :: thing means, you’d better read this excellent overview by @jussi-kalliokoski or have a look at the function bind syntax proposal.

    License

    MIT © Christoph Hermann

    install

    npm i react-mini-this

    Downloadsweekly downloads

    3

    version

    0.1.1

    license

    MIT

    repository

    githubgithub

    last publish

    collaborators

    • avatar