小编Yev*_*nko的帖子

如何使用 Redux Toolkit 中的 RTK 查询发送文件?

我正在尝试使用 RTK 查询突变将文件上传到 API。这是我的突变代码:

    addBanner: builder.mutation({
          query(body) {
            return {
              url: `/api/banners`,
              method: 'POST',
              body,
            }
          },
        })
Run Code Online (Sandbox Code Playgroud)

这是我生成请求数据的方法。

    const [addBanner, { isBannerLoading }] = useAddBannerMutation();
Run Code Online (Sandbox Code Playgroud)
    const new_banner = new FormData();    
    new_banner.append("file", my_file);
    new_banner.append("type", my_type);
    new_banner.append("title", my_title);
    addBanner(new_banner).unwrap().then( () => ... 
Run Code Online (Sandbox Code Playgroud)

但我收到一个错误:

A non-serializable value was detected in the state, in the path: `api.mutations.L-Mje7bYDfyNCC4NcxFD3.originalArgs.file`...
Run Code Online (Sandbox Code Playgroud)

我知道我可以通过中间件完全禁用不可序列化检查,但我认为这不是使用 Redux Toolkit 和 RTK 的合适方法。没有文件一切正常。RTK上传文件有什么正确的方法吗?

file-upload redux redux-toolkit rtk-query

12
推荐指数
1
解决办法
2万
查看次数

标签 统计

file-upload ×1

redux ×1

redux-toolkit ×1

rtk-query ×1