我用的是antd图片墙/卡片 https://ant.design/components/upload/#components-upload-demo-picture-card使用此将图像上传到我的 firebase 存储的示例参考代码 https://codesandbox.io/s/ym52x4q1p1我唯一要改变的地方是action
属性于<Upload>
成分。
On the action
属性,我正在使用将图像上传到 firebase 存储而不是链接的函数如文档中所示,两者都被接受.
我的动作函数如下所示;
export async function uploadImage(file) {
const storage = firebase.storage()
const metadata = {
contentType: 'image/jpeg'
}
const storageRef = await storage.ref()
const imageName = generateHashName() //a unique name for the image
const imgFile = storageRef.child(`Vince Wear/${imageName}.png`)
return imgFile.put(file, metadata)
}
问题来了,图像成功上传到 firebase,但我不断收到 antd 响应处理错误,并且可能不确定是什么action
函数应该返回,尽管文档中写到它应该返回一个承诺。
错误信息:
XML Parsing Error: syntax error
Location: http://localhost:3000/[object%20Object]
Line Number 1, Column 1:
错误还会在上传的图像缩略图上显示为红色边框。
请求帮助,我的操作函数应该返回什么来消除错误。我可以解析我的 firebase 响应并将必要的详细信息返回给 antd 上传操作。
Using
"antd": "^3.9.2",
"firebase": "^5.8.5",
"react": "^16.7.0",