@@ -11,12 +11,12 @@ title: FAQ
1111AsyncStorage only stores strings. Serialize values with ` JSON.stringify ` before writing, and ` JSON.parse ` when reading:
1212
1313``` typescript
14- import {createAsyncStorage } from " @react-native-async-storage/async-storage" ;
14+ import { createAsyncStorage } from " @react-native-async-storage/async-storage" ;
1515
1616const storage = createAsyncStorage (" my-app" );
1717
1818// Storing an object
19- const user = {name: " John" , age: 30 };
19+ const user = { name: " John" , age: 30 };
2020await storage .setItem (" user" , JSON .stringify (user ));
2121
2222// Reading it back
@@ -47,19 +47,19 @@ The v3 `AsyncStorage` instance implements exactly the storage interface Redux Pe
4747` removeItem ` ), so you can pass an instance directly as the ` storage ` option:
4848
4949``` typescript
50- import {createAsyncStorage } from " @react-native-async-storage/async-storage" ;
51- import {persistReducer , persistStore } from " redux-persist" ;
52- import {combineReducers , createStore } from " redux" ;
50+ import { createAsyncStorage } from " @react-native-async-storage/async-storage" ;
51+ import { persistReducer , persistStore } from " redux-persist" ;
52+ import { combineReducers , createStore } from " redux" ;
5353
5454const storage = createAsyncStorage (" redux" );
5555
5656const persistConfig = {
57- key: " root" ,
58- storage ,
57+ key: " root" ,
58+ storage ,
5959};
6060
6161const rootReducer = combineReducers ({
62- // your reducers
62+ // your reducers
6363});
6464
6565const persistedReducer = persistReducer (persistConfig , rootReducer );
@@ -77,31 +77,31 @@ TanStack Query's `@tanstack/query-async-storage-persister` package expects a sto
7777and ` removeItem ` . The v3 AsyncStorage instance matches this interface directly:
7878
7979``` jsx
80- import {createAsyncStorage } from " @react-native-async-storage/async-storage" ;
81- import {createAsyncStoragePersister } from " @tanstack/query-async-storage-persister" ;
82- import {QueryClient } from " @tanstack/react-query" ;
83- import {PersistQueryClientProvider } from " @tanstack/react-query-persist-client" ;
80+ import { createAsyncStorage } from " @react-native-async-storage/async-storage" ;
81+ import { createAsyncStoragePersister } from " @tanstack/query-async-storage-persister" ;
82+ import { QueryClient } from " @tanstack/react-query" ;
83+ import { PersistQueryClientProvider } from " @tanstack/react-query-persist-client" ;
8484
8585const queryClient = new QueryClient ({
86- defaultOptions: {
87- queries: {
88- gcTime: 1000 * 60 * 60 * 24 , // 24 hours
89- },
86+ defaultOptions: {
87+ queries: {
88+ gcTime: 1000 * 60 * 60 * 24 , // 24 hours
9089 },
90+ },
9191});
9292
9393const storage = createAsyncStorage (" tanstack-query" );
94- const persister = createAsyncStoragePersister ({storage});
94+ const persister = createAsyncStoragePersister ({ storage });
9595
9696export default function App () {
97- return (
98- < PersistQueryClientProvider
99- client= {queryClient}
100- persistOptions= {{persister}}
101- >
102- < YourApp/ >
103- < / PersistQueryClientProvider>
104- )
97+ return (
98+ < PersistQueryClientProvider
99+ client= {queryClient}
100+ persistOptions= {{ persister }}
101+ >
102+ < YourApp / >
103+ < / PersistQueryClientProvider>
104+ );
105105}
106106```
107107
@@ -114,30 +114,30 @@ Zustand's `persist` middleware accepts a custom storage adapter via `createJSONS
114114returning an AsyncStorage instance:
115115
116116``` typescript
117- import {create } from " zustand" ;
118- import {persist , createJSONStorage } from " zustand/middleware" ;
119- import {createAsyncStorage } from " @react-native-async-storage/async-storage" ;
117+ import { create } from " zustand" ;
118+ import { persist , createJSONStorage } from " zustand/middleware" ;
119+ import { createAsyncStorage } from " @react-native-async-storage/async-storage" ;
120120
121121const storage = createAsyncStorage (" zustand" );
122122
123123interface BearState {
124- bears: number ;
125- addBear: () => void ;
126- reset: () => void ;
124+ bears: number ;
125+ addBear: () => void ;
126+ reset: () => void ;
127127}
128128
129129export const useBearStore = create <BearState >()(
130- persist (
131- (set ) => ({
132- bears: 0 ,
133- addBear : () => set ((state ) => ({bears: state .bears + 1 })),
134- reset : () => set ({bears: 0 }),
135- }),
136- {
137- name: " bear-storage" ,
138- storage: createJSONStorage (() => storage ),
139- }
140- )
130+ persist (
131+ (set ) => ({
132+ bears: 0 ,
133+ addBear : () => set ((state ) => ({ bears: state .bears + 1 })),
134+ reset : () => set ({ bears: 0 }),
135+ }),
136+ {
137+ name: " bear-storage" ,
138+ storage: createJSONStorage (() => storage ),
139+ }
140+ )
141141);
142142```
143143
@@ -153,16 +153,19 @@ All AsyncStorage methods throw `AsyncStorageError` on failure. Use a try/catch b
153153specific failure modes:
154154
155155``` typescript
156- import {AsyncStorageError , createAsyncStorage ,} from " @react-native-async-storage/async-storage" ;
156+ import {
157+ AsyncStorageError ,
158+ createAsyncStorage ,
159+ } from " @react-native-async-storage/async-storage" ;
157160
158161const storage = createAsyncStorage (" my-app" );
159162
160163try {
161- await storage .setItem (" key" , " value" );
164+ await storage .setItem (" key" , " value" );
162165} catch (e ) {
163- if (e instanceof AsyncStorageError ) {
164- console .error (` Storage error [${e .type }]: ${e .message } ` );
165- }
166+ if (e instanceof AsyncStorageError ) {
167+ console .error (` Storage error [${e .type }]: ${e .message } ` );
168+ }
166169}
167170```
168171
@@ -172,4 +175,3 @@ See the [Error handling](api/errors.md) guide for the full list of error types a
172175
173176Batch operations (` setMany ` , ` getMany ` , ` removeMany ` ) are atomic. If any part of the operation fails, the entire batch
174177is rolled back and an ` AsyncStorageError ` is thrown. No partial writes will be committed.
175-
0 commit comments