未捕获的 TypeError：React.createClass 不是函数异常答案

【问题标题】：Uncaught TypeError: React.createClass is not a function exception未捕获的 TypeError：React.createClass 不是函数异常
【发布时间】：2018-10-10 02:37:09
【问题描述】：

我做了一个这样的html页面

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>React project</title>

    <script crossorigin src="https://unpkg.com/react@16/umd/react.production.min.js"></script>
    <script crossorigin src="https://unpkg.com/react-dom@16/umd/react-dom.production.min.js"></script>
    <script src="https://unpkg.com/babel-core@5.8.38/browser.min.js"></script>
  </head>
  <body>
    <div id="root"></div>
    <script src="react.js" type="text/babel"></script>
  </body>
</html>

文件 react.js 像这样

var Comp1 = React.createClass({
  render: function() {
    return(
      <h1> Comp1 </h1>
    );
  }
});


ReactDOM.render(
  <div>
    <Comp1/>
  </div>,
  document.getElementById("root")
);

但是，我得到了“Uncaught TypeError: React.createClass is not a function”异常，为什么？

【问题讨论】：

"Uncaught TypeError: React.createClass is not a function" in Render.js file (electron app)的可能重复

标签： reactjs

【解决方案1】：

通常你会将 React 组件定义为纯 JavaScript 类：

class Comp1 extends React.Component {
  render() {
    return <h1> Comp1 </h1>;
  }
}

如果你还没有使用 ES6，你可以使用 create-react-class 模块来代替：

var createReactClass = require('create-react-class');
var Comp1= createReactClass({
  render: function() {
    return <h1> Comp1 </h1>;
  }
});

或者，

import React from 'react';

const Contacts = React.createClass({
  render() {
    return (
      <div></div>
    );
  }
});

export default Contacts;

【讨论】：