useLocalStorage

useLocalStorage hook provides a simple way to handle saving data to the localStorage.

Import

import { useLocalStorage } from "@prismane/core/hooks";

Usage

function Demo() {
  const [count, setCount] = useLocalStorage("count", 0);

  const increment = () => {
    setCount((prevCount: number) => prevCount + 1);
  };

  return (
    <Flex direction="column" gap={fr(2)}>
      <Text
        cl={(theme) => (theme.mode === "dark" ? ["base", 200] : ["base", 700])}
      >
        {count}
      </Text>
      <Button onClick={() => increment()}>Increment</Button>
    </Flex>
  );
}

API

Parameters

Name	Type	Description	Default
`key`	`string`	The key with which the value will be gotten from the localStorage, if it does not exist a value will be created with that key.	-
`defaultValue`	`any`	The default value, if a property with this key does not exist inside the localStorage.	-

Return Value

Name	Type	Description
`value`	`any`	The value from the localStorage.
`setValue`	`Dispatch<any>`	Function that sets the value in the localStorage.

Go BackuseKeyboardShortcut

Up NextuseLocalization