“未捕获的类型错误:React.createClass 不是函数"在 Render.js 文件中(电子应用程序)

2022-01-10 00:00:00 electron javascript jsx package.json react-dom

我是 react.js 的新手，我试图让这段代码用 MainInterface 变量中返回的任何内容替换电子应用程序内的 html 文件中的一行

I'm new to react.js and I am trying to get this code to replace one line in an html file inside an electron app with whatever is in return inside the MainInterface variable

这是我的 Render.js 文件

This is my Render.js File

var React = require('react');
var ReactDOM = require('react-dom');

var $ = jQuery = require('jquery');
var bootstrap = require('bootstrap');

//var createReactClass = require('create-react-class');

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

ReactDOM.render(
  <MainInterface />,
  document.getElementById('projects')
);//render

这是 html 文件(正在寻找替换 WPM ...正在加载)(我的实际文件中确实有最后一个 html 标记)

This is the html file (looking to replace WPM ... loading) (I do have the last html tag that is missing here in my actual file)

> <!DOCTYPE html> <html lang ="en">   <head>
>     <meta charset="utf-8">
>     <meta name ="viewport" content="width=device-width, initial-scale=1.0">
>     <meta http-equiv="X-UA-Compatible" content="ie=edge">
>     <link rel="stylesheet" href="css/app.css">
>     <title>Project Manager</title>   </head>   <body>   <div claa="main">
>     <div class="page" id="projectratings">
>       <div id="projects">
>         <h2>WPM ... loading</h2>
>       </div>
>     </div>   </div> <script src="js/render.js"></script>   </body>

这是我的 package.json

This is my package.json

{
  "name": "ETest",
  "version": "1.0.0",
  "main": "app/main.js",
  "devDependencies": {
    "create-react-class": "^15.6.2",
    "electron": "^1.7.8",
    "electron-packager": "^9.1.0",
    "gulp": "^3.9.1",
    "gulp-browserify": "^0.5.1",
    "gulp-concat-css": "^2.3.0",
    "gulp-react": "^3.1.0",
    "gulp-run": "^1.7.1",
    "react": "^16.0.0",
    "react-addons-test-utils": "^15.6.2",
    "react-dom": "^16.0.0",
    "reactify": "^1.1.1"
  },
  "dependencies": {
    "bootstrap": "^3.3.7",
    "electron-reload": "^1.2.2",
    "jquery": "^3.2.1",
    "lodash": "^4.17.4"
  }
}

我已尝试安装 creat-react-class 并使用它(如在 render.js 文件中注释掉的行中所见)

I have tried installing creat-react-class and using that (as seen in the line that is commented out in the render.js file)

我已经卸载并重新安装了 react 和 react-dom

I have uninstalled and reinstalled both react and react-dom

不知道我还缺少什么

继续努力

C:UsersuserDesktopElectronTestingprocessjsfake_6052bf8b.js:8 
Uncaught TypeError: React.createClass is not a function

我的 render.js 文件位于 ElectronTestingprocessjsender.js不知道为什么它指向 fake_6052bf8b.js 我一直假设这是某种类型的临时文件(如果我错了请纠正我)

my render.js file is found at ElectronTestingprocessjsender.js not sure why it points to fake_6052bf8b.js I've been assuming that's some type of temp file (please correct me if I am wrong)

感谢您的任何帮助.

**EDIT 是的，只是一个简单的错误，忘记将 React.createClass 替换为 createReactClass，感谢代码示例让我终于看到它！

**EDIT yep just a simple mistake, forgot to replace React.createClass with createReactClass, thanks for the code example that made me finally see it!!

推荐答案

React 从版本 16 中删除了 createClass.您可以使用 create-react-class 轻松迁移，如 react 文档中所示.

React removed createClass from version 16. You can use create-react-class to migrate easily as shown in react documentation.

// Before (15.4 and below)
var React = require('react');

var Component = React.createClass({
  mixins: [MixinA],
  render() {
    return <Child />;
  }
});

// After (15.5)
var React = require('react');
var createReactClass = require('create-react-class');

var Component = createReactClass({
  mixins: [MixinA],
  render() {
    return <Child />;
  }
});

阅读更多关于此https://reactjs.org/blog/2017/04/07/react-v15.5.0.html#migrating-from-reactcreateclass

相关文章