反应 createElement 错误 "type is invalid -- expected a string got object"

React createElement error "type is invalid -- expected a string got object"

我在一个 React 项目中遇到过这个问题。我正在使用 rc-upload 包在 React 中上传文件。代码如下:

import React, { Component } from 'react';
import logo from './logo.svg';
import './App.css';
const Upload = require('rc-upload');

class App extends Component {
 constructor(props) {
 super(props);
 this.uploaderProps = {
    action: '/upload/',
    data: { user_id: 1 },
    headers: {
      Authorization: `Bearer abcdef`,
    },
    multiple: false,
    beforeUpload(file) {
      console.log(file);
    },
    onStart: (file) => {
      // console.log('onStart', file.name);
    },
    onSuccess(result) {
      console.log(result);
    },
    onProgress(step, file) {
      console.log('Progress: ', Math.round(step.percent), file.name);
    },
    onError(err) {
      // Show response data with close button in modal body
      console.log('onError', err);
    }
  };
 }
 render() {

  return (
   <div className="App">
    <div className="App-header">
      <img src={logo} className="App-logo" alt="logo" />
      <h2>Welcome to React</h2>
    </div>
    <p className="App-intro">
      To get started, edit <code>src/App.js</code> and save to reload.
    </p>
    <Upload {...this.uploaderProps}>Choose File</Upload>
   </div>
  );
 }
}
export default App;

此代码适用于 react@15.5.4 和 react-scripts@0.9.5 以及 react 或 react-scripts 的开发依赖项。几个月前,我通过 create-react-app 创建了 React 应用程序。现在我用 create-react-app 创建了新的应用程序,它安装了 react@15.6.1 和 react-scripts@1.0.12.

所以当我 运行 在新项目中使用上面的代码时,它显示了这个错误。

React.createElement: type is invalid -- expected a string (for built-in components) or a class/function (for composite components) but got: object

我发现它来自以下代码:

<Upload {...this.uploaderProps}>Choose File</Upload>

它在我以前的 react@15.5.4 版本中有效,但在 react@15.6.1 中无效

如何解决这个错误?这是版本错误还是任何其他依赖性错误?

问题与上传组件如何导入项目有关。这可能是组件的错误。不知道这是不是有意为之,但您需要像这样导入组件;

const Upload = require('rc-upload').default;
// or
import Upload from 'rc-upload';