Simple global state for React with Context API
npm install react-context-global-statereact-context-global-state
==========================



Simple global state for React with Context API
Background
----------
React v16.3 introduces a new Context API.
Context API allows to pass values down to a component tree
without explicit props.
In favor of writing all components stateless in "thisless" JavaScript,
this package is developed.
This package provides a simple way to define a global state
with Context API.
Install
-------
``bash`
npm install react-context-global-state
Usage
-----
`javascript
import React from 'react';
import { createGlobalState } from 'react-context-global-state';
const initialState = { counter: 0 };
const { StateProvider, StateConsumer } = createGlobalState(initialState);
const Counter = () => (
{(value, update) => (
Counter: {value}
)}
);
const App = () => (
);
`
Example
-------
The examples folder contains working examples.
You can run one of them with
`bash`
PORT=8080 npm run examples:minimal
and open
You can also try them in codesandbox.io:
01
02
03
04
05
Reference
---------
createGlobalState(initialState)
`$3
initialState: an object like { name1: value1, name2: value2, ... }$3
An object of { StateProvider, StateConsumer, setGlobalState }StateProvider: a component to provide entire stateStateConsumer: a component that receives a required name prop and invokes a child function prop whose signature is (value, update) => {} where value is the state value specified by the name and update is a function to update the valueThe
update function above is similar to Component.prototype.setState, and accepts either an updating function or a new value itself.setGlobalState: a function to update a value in global state from outside of components. It recevies a name and a update value (or function).getGlobalState: a function to get a value in global state from outside of components. It recevies a name`.Blogs
-----
- React global state by Context API
- React global state by Context API for TypeScript