Reactjs Redux操作中的不可序列化文件对象

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

{
类型：“用户/更新请求”，
有效负载：{name:'Foo'，avatar:File}
}

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

当动作被分派时，会发生三件事：

• 减速机更新

  状态.user.name

  ，但忽略

  化身

• Saga将文件上传到API
• 传奇使用文件阅读器获取数据URL并发送另一个操作（这会导致更新

  state.user.avatar

  ）

我从不将文件对象存储在存储中，它只是在操作中

---

是否有更好的方法，或者这是一个不可序列化操作有效的用例？

该文件在理论上是可序列化的（例如base64），但它可能会使使用devtools变得更困难，或者对如此多的数据造成其他意外的副作用

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

您可以保存文件的散列（或者只是名称和时间戳）并将其用作密钥，以便在需要保存内容时在另一种类型的存储中访问文件。这将使时间旅行再次起作用，但前提是这些动作要在可以访问文件内容的相同环境中重放。

我也面临同样的问题。 这就是我如何配置我的商店

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

一旦我摆脱了

getDefaultMiddleware

，错误就消失了。

导出默认配置存储({
减速器：{
\\把你的减速器放在这里
},
中间件：getDefaultMiddleware({
\\这样你就不会移除中间产品
serializableCheck:false，
}),
});

我使用相同的方法，所以我认为这很好（因为没有找到更好的解决方案）。只是出于兴趣，您是否对文件执行任何压缩？@MattSugden不，这是直接从

-

myInput.files[0]

sagas读取/上载我刚才请求的操作中的文件，因为我刚刚做了类似的操作，在iPhone上拍照时，图像大小约为4MB，需要上传和下载的空间很大。这确实会从日志中删除警告和错误。但是，这只是忽视了问题。通过删除默认的中间件，您将删除thunk中间件，或者在生产环境中删除immutableCheck和serializableCheck中间件。这两个检查进入redux操作和状态的数据。通过删除serializableCheck中间件，警告和错误就会消失。