使用Fable-Elmish将React.FormEvent转换为BodyInit

Question

我正在尝试使用Fable-Elmish和React Helpers上传文件.但是,当我选择一个文件到可以使用Fetch发送到服务器的东西时,我无法弄清楚如何转换表单事件.这是观点:

R.input [
        ClassName "input-control" 
        Type "file"
        OnChange (fun x -> FileUploaded x.target |> dispatch )
    ] []

我更新功能的相应部分:

 | FileUploaded file ->
    model, Cmd.ofPromise postCsv file FetchSuccess FetchFailure

以及使用fetch调用api的函数:

let postData input =
    let formData = FormData.Create()
    formData.append("file.csv", input?files)
    let defaultProps =
        [ RequestProperties.Method HttpMethod.POST
        ; RequestProperties.Body (formData |> unbox)]
    promise {
        return! Fable.PowerPack.Fetch.fetch ("/api/data") defaultProps
    }

如何将React.FormEvent转换为获取所需的BodyInit？

Answer 1

事实证明我没有正确使用 FileList API。这是 post 方法的工作解决方案：

let postData input =
let formData = FormData.Create()
formData.append("file.csv", input?files?item(0))
let defaultProps =
    [ RequestProperties.Method HttpMethod.POST
    ;RequestProperties.Headers [unbox EncType "multipart/form-data"]
    ; RequestProperties.Body (formData |> unbox)]
promise {
    return! Fable.PowerPack.Fetch.fetch ("/api/data") defaultProps
}