Dropzone Apollo-upload-client使用上传！类型

Question

我正在使用apollo-upload-client（所以graphQL），我正在尝试使用dropzone将文件上传到我的服务器。

我使用<input required onChange={({ target: { validity, files: [file] } })=> this._uploadFiles(validity, file)}功能

成功完成了这项工作

_uploadFiles = async (validity, file) => {
        if (validity.valid){
            await this.props.addImageFileMutation({
                variables: {file}
            })
        }
    }

对于Dropzone，我有：

<Dropzone
                      onDrop={this._onDrop.bind(this)}
                      multiple={false}>
                    </Dropzone>

使用函数：

_onDrop = async (acceptedFiles, rejectedFiles) => {
        const firstFile = acceptedFiles[0]
        await this.props.addImageFileMutation({
            variables: { firstFile }
        })
    }

以下是从每个发送的文件，它们看起来和我一样！但它只适用于<input />！ 第一个值使用<Dropzone />，第二个值使用<input />。

您知道为什么我的$file不符合Upload!问题吗？我在下面添加了一些代码供参考。

const ADD_IMAGE_FILE_MUTATION = gql`
mutation AddImageFileMutation ($file: Upload!) {
    addImageFile(file: $file){
        id
}}`

Answer 1

在_onDrop内，您将一个名为firstFile的变量传递给您的变异，但它正在寻找名为file的变量：

variables: { firstFile }

请改为尝试：

variables: { file: firstFile }