npm install --save context-simplifieryarn add context-simplifierCreates a context and returns the provider.
| Param | Type | Description |
|---|---|---|
| contextName | string:required | Context name must be string without any spaces or special characters. Examples: count, countContext |
| initialValue | any:optional | Initial Value for the context |
| reducerFunction | function:optional | Reducer function to update context value. Reducer function will receive two params state and action |
Creates a context and returns the provider.
| Param | Type | Description |
|---|---|---|
| contextName | string:required | Provide the context name to fetch its value |
Creates a context and returns the provider.
| Param | Type | Description |
|---|---|---|
| contextName | string:required | Provide the context name to get its setter function |
Use createContextProvider to create new context. It will return the provider for the created context
import React, { Component } from 'react' import { createContextProvider } from 'context-simplifier' const App = () => { const CountProvider = createContextProvider('count', 0) return ( <> <CountProvider> <Counter /> <Layout> <CountDisplay /> </Layout> </CountProvider> </> ) }import React from 'react' import { getContextValue } from 'context-simplifier' const CountDisplay = () => { const count = getContextValue('count') return <div>{count}</div> } export default CountDisplayUse getContextAction to get the setter function which can be used to update the context value
import React from 'react' import { getContextAction } from 'context-simplifier' const Counter = () => { const setCount = getContextAction('count') const increment = () => { setCount((oldValue) => oldValue + 1) } const decrement = () => { setCount((oldValue) => oldValue - 1) } return ( <> <button onClick={increment}>Increment</button> <button onClick={decrement}>Decrement</button> </> ) } export default CounterMIT © Harshdand