Skip to content

🔄 Demo having a component preserve it's local state but be updated by a global state source

Notifications You must be signed in to change notification settings

iamogbz/react-global-local-state

Repository files navigation

React useValue

NPM badge Dependabot badge Dependencies Build Status Coverage Status

Solves the problem of updating an internal component based on values passed in from a different source that can be updated independently.

Usage

You have an initial text value of "John Doe" loaded and kept in sync with the source of the value e.g. web API, and need the field holding that value updated to "Jane Doe" without affecting the parent but also be reset to the parent value when it's changed to a newer version like "John M. Doe".

Example code

import { useValue, useTrackedValue, useSyncedValue } from 'react-use-value';

See type documentation for details on how each is used.

synced input values

Edit on StackBlitz ⚡️