Immutable state for React.js
react-cursor hello-world in a fiddle
What is react-cursor
Cursors are useful in UI programming, because UIs are tree shaped and naturally have tree-shaped state. Cursors let your app hold all its state in one place at the root of the UI tree; thus the root is stateful, and all downtree views are stateless.
master is stable, there is a full test suite.
Cursor interface has three methods:
cur.value()return the value in the cursor at some path.
cur.refine(path, ...paths)return a cursor nested inside another cursor
cur.swap(f)apply f to the value in the cursor value and puts returned value into the backing store
For frequently used swap functions, see the bundled
update-in dependency: see here. Cursor instances have optional syntax sugar for the swap fns provided by update-in; see CursorOperations.js
- Cursors have value semantics, don't mutate values that come out of a cursor
- Equal cursors are
===for easy and efficient optimized rendering (see hello world jsfiddle for example)
- You should read the source! The core cursor abstraction is 15 lines of code
- There is an undocumented alternate implementation,
RefCursor, which has reference semantics, this is only useful for working with legacy mutable code
react-cursor is governed under the MIT License.
react-cursor was built by Daniel Miladinov and Dustin Getz.