SyncState

SyncState

  • Docs
  • FAQ
  • Github
  • Hire The Creators

›API Reference

Introduction

  • Getting started
  • Installation
  • Motivation
  • Core Concepts

Recipes

  • Recipes

Examples

  • Counter
  • Counter with Undo / Redo
  • Todo app
  • Multi User Counter
  • Multi User Todo
  • Multi User Todo With Undo/Redo

Plugins

  • History
  • Remote

API Reference

  • API Overview
  • createDocStore
  • Store
  • Provider
  • useDoc
  • useSyncState

Tips & Tricks

  • Common Pitfalls & Best Practices
  • Using SyncState without React
  • Performance Tuning

FAQ

  • FAQ's

useSyncState

This is like store.useSyncState but it also observers the updates on path (push strategy) and forces the component to update.

Arguments

  1. subtree (string): The subtree that you want to fetch the state from
  2. path (string?, default: ""): The path to state that you want to read and update
  3. depth (number?, default: 1): Same as depth in observe

Returns

(Array): An array with the following elements in order

  • State at path.
  • A function to modify the state.
    • Same as here
  • A dispatch function for you to dispatch any action to the internal Redux store.

Example

import { createDocStore } from "@syncstate/core";
import { useDoc } from "@syncstate/react";

const store = createDocStore({ counter: { count: 0 } }, []);

// Inside a React component
const [counter, setCounter, dispatch] = useDoc("/counter");

const increment = () =>
    setCounter((counter) => {
        counter.count++;
    });

const decrement = () =>
    setDoc((counter) => {
        counter.count--;
    });
← useDocCommon Pitfalls & Best Practices →
Docs
Getting StartedExamplesPluginsAPI ReferenceFAQ
Community
TwitterStack OverflowDiscord
More
GitHub   Contribution Guidelines
Stars
Built with ❤️ at GeekyAnts.
Copyright © 2020 SyncState