You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Copy file name to clipboardExpand all lines: docs/README.md
+36-29Lines changed: 36 additions & 29 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -15,34 +15,18 @@ import { createPersistMachine } from "redux-persist-machine";
15
15
16
16
### Setup
17
17
18
-
There are a couple of things you need to get started. Firstly add the return of `createPersistMiddleware` to your redux middleware.
19
-
20
-
The `createPersistMiddleware()` parameters are:
21
-
- the structure of your store and use arrays to define what values you want the middleware to persist
22
-
- a save method
23
-
- a load method
24
-
- (optional) whether to enable debug or not
25
-
26
-
The structure of your store consist of an object that takes some objects, and each object has to follow the following schema:
27
-
28
-
- The key of each value in the persist object should match your store shape, a nested reducer would be defined as such: `data.device`.
29
-
- In the `values` key, you can customize which values the package will keep track of. If nothing is provided to the `values` field, all fields will be saved.
30
-
- A `key` is required to be defined for each persisted reducer, this will be used as the async storage key, it keeps a static map of your data which is independent of its shape, which is useful as your application grows.
31
-
- An optional key of `action` can be defined to explicitly declare which action type should trigger a load of that reducer, without this value each load type is generated automatically from the state shape. e.g. to load `"data.device"` fire `LOAD_DATA_DEVICE`, to load `"subscriptionOrders"` fire `LOAD_SUBSCRIPTION_ORDERS`.
32
-
- An optional `automatic` key can also be provided to specify if that reducer should be loaded automatically, without having to dispatch the action. It defaults to `true`.
33
-
34
-
For the load and save method, you don't have to write them by yourself, they are [available as separate packages below](#providers).
18
+
Firstly add the return value of `createPersistMiddleware` to your redux middleware. Then after creating your store, run the `createPersistMiddleware().run` method.
35
19
36
20
```js
37
21
// e.g. save and load methods -> available as separate packages below
38
22
constsaveState= (key, state) =>...
39
23
constloadState= (key) =>...
40
24
41
-
/**
42
-
You define the structure that you want to save
43
-
in this object, and then pass it as an argument.
44
-
Instructions on how to create this object are above.
45
-
*/
25
+
/**
26
+
* You define the structure that you want to save
27
+
* in this object, and then pass it as an argument.
28
+
* Instructions on how to create this object are above.
29
+
*/
46
30
conststructure= {
47
31
orders: {
48
32
values: ["data", "updatedAt", "index"],
@@ -69,8 +53,6 @@ const structure = {
69
53
}
70
54
};
71
55
72
-
// store.js
73
-
74
56
constpersistMiddleware=createPersistMiddleware(
75
57
structure, saveState, loadState
76
58
)
@@ -80,15 +62,15 @@ export const store = createStore(
80
62
reducers,
81
63
applyMiddleware(...middleware)
82
64
);
65
+
66
+
// After setting the middleware in the store, you need to call `.run` and pass the store as an argument.
67
+
persistMiddleware.run(store)
83
68
```
84
69
85
-
Your reducer data will automatically saved when the values are changed. You can load each reducer using its load action (to see all the load actions generated in your console set the fourth parameter of `createPersistMachine` to `true`).
70
+
For the load and save method, you don't have to write them by yourself, they are [available as separate packages below](#providers).
86
71
87
-
After setting the middleware in the store, you need to call `createPersistMachine.run` and pass the store as an argument.
72
+
Your reducer data will automatically saved when the values are changed. You can load each reducer using its load action (to see all the load actions generated in your console set the fourth parameter of `createPersistMachine` to `true`).
88
73
89
-
```js
90
-
createPersistMachine.run(store)
91
-
```
92
74
93
75
### Loading Data
94
76
@@ -107,6 +89,31 @@ This allows you to have loading on a per reducer basis separated across the appl
107
89
108
90
The middleware runs: `action.payload = { ...storedData, ...action.payload };` to add the saved data to the payload when the `LOAD_ACTION` is triggered. You can also pass additional data in your payload to add context to your `LOAD_ACTIONS` for complex conditional consummation of the loaded data in your reducers.
Creates a Redux persist middleware with your store structure.
97
+
98
+
-`structure: Object` - A object to define how you want to load your reducer values. The key of each value in the persist object should match your store shape, a nested reducer would be defined as such: `data.device`. Currently supported options are:
99
+
-`values : Array` you can customize which values the package will keep track of. If nothing is provided to the `values` field, all fields will be saved.
100
+
-`key : string` this will be used as the storage key, it keeps a static map of your data which is independent of its shape, which is useful if your reducers change their structure or name.
101
+
-`action : string` defined to explicitly declare which action type should trigger a load of that reducer, without this value each load type is generated automatically from the state shape. e.g. to load `"data.device"` fire `@ReduxPM/LoadDataDevice`.
102
+
-`automatic : boolean` to specify if that reducer should be loaded automatically, without having to dispatch the action. It defaults to `true`.
103
+
-`saveState : Function` - a save function with the following signature `(key, state) => void`
104
+
-`loadState : Function` - a load function with the following signature `(key) => Object`
0 commit comments