javascript - 在reactjs应用中未定义uploadcare

我正在尝试对我的reactjs应用程序使用uploadcare来存储图像。但是我无法使其正常工作。我已按照文档进行操作，但出现错误“未捕获的TypeError：无法读取Object.u.openDialog（uploadcare.min.js：24）中未定义的属性'tabs'”。尽管我已经npm安装了uploadcare-widget并将其导入到我的文件中，但是它不起作用。以下是相关代码：

首先，我在index.html中添加脚本标签，如下所示：

<script>
  UPLOADCARE_PUBLIC_KEY = "demopublickey";
</script>

然后在我的组件中，我正在这样做：

import uploadcare  from 'uploadcare-widget';

class ImageComponent extends React.Component {
  componentDidMount() {
    uploadcare.start({publicKey: 'demopublickey'})
  }

  addImage(e) {
    uploadcare.openDialog(null, {
      imagesOnly: true,
      multiple: false,
    }).done((file) => {
      file.promise().done((fileInfo) => {
        console.log(fileInfo.cdn)
      })
    })
  }

  render () {
    const imageInput = (
      <div className='image-box'>
        <Button onClick={this.addImage}>Add Image</Button>
      </div>
    )

    return (
      <div>
        { this.state.imgSrc && this.renderImageView() }
        { !this.state.imgSrc && imageInput }
      </div>
    )
  }
}

我在这个问题上停留了很长时间。请帮忙！

最佳答案

您可能使用了3.0.0版本。在此版本中，openDialog中存在错误。在the issue on github中报告。

临时解决方案：设置第二个参数（tab）并为第三个参数（tabs）添加settings属性，请参见docs，

uploadcare.openDialog(null, 'file', {
  tabs: 'all',
  imagesOnly: true,
  multiple: false,
}).done((file) => {
  file.promise().done((fileInfo) => {
    console.log(fileInfo.cdn)
  })
})

今天，我将发布新版本的小部件，并修复此错误。您将可以更新和删除临时解决方案。