Skip to main content

useCloudStorage

Widget data storage. For the currently running widget, provide a useState - like interface to store, data is read and written by a specified key, if you set the value multiple times the data will be sent to the collaborator at 500ms intervals, key-value pairs are stored persistently. When the value changes, re-render is triggered, changes in value may from other collaborator, and it is not recommended to set default value when the widget first installed, because the initial default value is the same of multiple collaborators. Setting defaults multiple times can result in pointless performance waste or event dead loops, and data should be set up after changes in external data.

Type parameters

NameDescription
Sdefault value.

Parameters

NameTypeDescription
keystringKey at storage.
initValue?S | () => SInitial default value, can be passed value or function, same principle as useState parameter.

Returns

[S, Dispatch<SetStateAction<S>>, boolean]

are [return value, setValue function, permission to write or not] respectively.

Example

import { useCloudStorage } from '@apitable/widget-sdk';

// A simple counter
function Counter() {
const [counter, setCounter, editable] = useCloudStorage('counter', 0);
return (
<div>
Counter: {counter}
<Button size="small" disable={!editable} onClick={() => setCounter(counter + 1)}>+</Button>
<Button size="small" disable={!editable} onClick={() => setCounter(counter - 1)}>-</Button>
</div>
);
}