Dropzone Apollo-upload-client 使用 Upload!类型
Dropzone Apollo-upload-client using Upload! Type
我正在使用 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
}}`
在 _onDrop
中,您将一个名为 firstFile
的变量传递给您的突变,但它正在寻找一个名为 file
:
的变量
variables: { firstFile }
试试这个:
variables: { file: firstFile }
我正在使用 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
}}`
在 _onDrop
中,您将一个名为 firstFile
的变量传递给您的突变,但它正在寻找一个名为 file
:
variables: { firstFile }
试试这个:
variables: { file: firstFile }