例如,我有一些带有JSON数据的txt文件:
"assets": [
{
"id": 1,
"name": "Mike",
"contract": "N23421",
"about": teacher
},
{
"id": 2,
"name": "Helen",
"contract": "N43212",
"about": teacher
}
]
通常我使用Redux从服务器上传/解析此文件。
那时我需要从本地存储中获取上传相同的文件。 那么,如何通过将Actions和Reducers用于本地文件来实现此目的呢? 如有任何帮助或建议,我将不胜感激。
答案 0 :(得分:2)
我建议使用一些与redux-api-middleware工作方式类似的本地存储中间件。除非您不从服务器获取数据,否则您只需从本地存储中检索数据即可。这可以很容易地扩展到保存数据。这里的想法是你会根据你所处的请求阶段发出不同的行动。
e.g。
LOCAL_STORAGE_RETRIEVE_PENDING
LOCAL_STORAGE_RETRIEVE_SUCCESS
LOCAL_STORAGE_RETRIEVE_FAILURE
成功操作将包含检索到的JSON数据。
或者,您可以直接在您的操作创建者中访问本地存储。
这是一个用typescript编写的非常简单的例子。您还需要添加一个适当响应调度操作的reducer。请注意,要使用此示例,您需要添加redux-thunk
中间件。
const localStorageRequest = () => ({
type: 'LOCAL_STORAGE_REQUEST'
});
const localStorageDataRetrieved = (data) => ({
type: 'LOCAL_STORAGE_DATA_RETRIVED'
data,
});
export const getDataFromLocalStorage = (key: string) => (dispatch: Dispatch<any>) => {
// This action might be used to change some state to pending or fetching.
dispatch(localStorageRequest());
const data = localStorage.getItem(key);
dispatch(localStorageDataRetrieved(data));
};
目前,更简单的解决方案是在您的动作创建者中执行此操作。随着应用程序的增长,您可以在以后添加中间件。