Get and set local and session storage using the React Context API
yarn add react-storage-context
StorageContext
Initializes and manages storage, setting the values of the StorageContext.Provider
import StorageContext from "react-storage-context"
@StorageContext("your-storage-id")
class App extends PureComponent {
render() {
// children that will read and write storage
}
}
withStorageContext
Will provide the api as props:
local
local storage objectsession
session storage objectsetLocal
update local storage objectsetSession
update session storage object
import { withStorageContext } from "react-storage-context"
@withStorageContext
class App extends PureComponent {
render() {
// props to read
const {
local: { someLocalVal },
session
} = this.props
// props to invoke save methods
const { saveLocal, saveSession } = this.props
return <div>{someLocalVal}</div>
}
}
Consumer
import { Consumer } from "react-storage-context"
class App extends PureComponent {
render() {
// render props
return (
<Consumer>{({ session }) => <div>Session storage values: {JSON.stringify(session, undefined, 4)}</div>}</Consumer>
)
}
}
MIT © giannif