QuickContext

ContextAPI state management made easy

Install

npm install --save quickcontext

Usage

Changing values in a context as simple as:

this.context.store.value = newValue;

Your context module:

import {createContext} from 'quickcontext';
 
const eContext = createContext({
  clicks: 0,
});
 
export const Context = eContext.Context;
export const Consumer = eContext.Consumer;
export const Provider = eContext.Provider;

Your app:

import {Provider} from './Context';
import {Component} from './Component';
 
export const App = () =>
  <Provider>
    <Component/>
  </Provider>

Your component:

import React from 'react';
import {Context} from './Context';
 
export class Component extends React.Component {
  click = () => this.context.store.clicks = Math.random()
 
  render() {
    return <React.Fragment>
      <button onClick={this.click}/>
      Clicked: {this.context.store.clicks}<br/>
    </React.Fragment>
  }
}
 
Component.contextType = Context;

For more information have a look at example.

License

MIT © PixelsCommander