Question

我目前有一个Redux动作，如下所示：

{
  type: 'user/updateRequested',
  payload: {name: 'Foo', avatar: File}
}

该文件不可序列化，所以我想知道是否有更好的方法。

调度动作时，会发生三件事：

Reducer更新state.user.name，但忽略avatar
Saga将文件上传到API
Saga使用FileReader获取数据URL并调度另一个操作（这导致state.user.avatar被更新）

我从不将File对象存储在存储中，只是在操作中。

有没有更好的方法，或者这是非序列化操作有效的用例？

Answer 1

该文件理论上是可序列化的（例如，base64），但使用如此大量的数据可能会使devtools的使用更加困难或引起其他意外后果。

我同意不将实际文件内容存储在操作有效载荷中是有效的。

您可以保存文件的哈希（或简称为名称和时间戳），并在需要包含内容的情况下，将其用作访问另一类型存储中文件的密钥。这将使时间旅行再次工作，但前提是必须在可以访问文件内容的相同环境中重播动作。

Answer 2

export default configureStore({
  reducer: {
   \\Put your reducers here
  },
  middleware:getDefaultMiddleware({
    \\this way you don't remove the middlewares
    serializableCheck:false,
  }),
});

Answer 3

我遇到了同样的问题。这是配置我的商店的方式。

export default configureStore({
    reducer: {
      vehicles: vehicleReducer,
    },
    middleware: [...getDefaultMiddleware(), apiMiddleware],
});

一旦我摆脱了getDefaultMiddleware，我的错误就消失了。

Redux操作中的不可序列化File对象

3 个答案: