Skip to content

edilsalvador/react-context-hook

 
 

Repository files navigation

react-context-hook

A React.js global state manager with Hooks and Context API

NPM JavaScript Style Guide

Install

npm install --save react-context-hook

Documentation

Read the documentation of react-context-hook:

Usage

Wrap your React App in the store Provider using the function withStore.

import { withStore} from 'react-context-hook'

const initialState = { count: 10 }

const storeConfig = {
  listener: state => {
    console.log('state changed', state)
  },
  logging: true //process.env.NODE_ENV !== 'production'
}

export default withStore(App, initialState, storeConfig)

withStore creates a React Context.Provider which wrap your application the value of the Provider is the store. The store is similar to a Javascript Map where you can put, read, and delete values by their key.

For example store.set('username', {name: 'spyna', email: '[email protected]'}) will set a username key in the store map. Then you can read, modify or delete it from the map using store.get('username') or store.remove('username').

The store is exported as store from react-context-hook, so you can use it in the Components. However for convenience, in React Components you can use the hooks exported from react-context-hook.

Hooks

withStore - doc

useStore - docs

useStoreState - docs

useSetStoreValue - docs

useDeleteStoreValue - docs

useGetAndset - docs

useGetAndDelete - docs

useSetAndDelete - docs

useStoreValue - docs

License

MIT © Spyna

Analytics

About

A React.js global state manager with Hooks and Context API

Resources

Stars

Watchers

Forks

Packages

No packages published

Languages

  • JavaScript 86.7%
  • CSS 9.7%
  • HTML 3.6%