Render.js 文件(电子应用程序)中的“未捕获的 TypeError:React.createClass 不是函数”

Posted

技术标签:

【中文标题】Render.js 文件(电子应用程序)中的“未捕获的 TypeError:React.createClass 不是函数”【英文标题】:"Uncaught TypeError: React.createClass is not a function" in Render.js file (electron app) 【发布时间】:2018-03-15 07:47:44 【问题描述】:

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

这是我的 Render.js 文件

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 标记)

> <!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


  "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 文件中注释掉的行中所见)

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

不知道我还缺少什么

继续努力

C:\Users\user\Desktop\ElectronTesting\process\js\fake_6052bf8b.js:8 
Uncaught TypeError: React.createClass is not a function

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

感谢您的任何帮助。

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

【问题讨论】:

您在尝试使用createReactClass时遇到了什么错误? 这是新代码吗?如果是这样,请不要使用 create-react-class,只需编写现代 JS 并从 React 的 Component 类扩展您的组件。 【参考方案1】:

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

// 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

【讨论】:

谢谢,虽然我在尝试实现它时发现了这一点,但似乎我忘了用 createReactClass 替换 React.createClass ... 总之,facepalm。感谢您的帮助! 还要注意 Mixins 很久以前就被弃用了,因为它们是 a considered harmful pattern,所以此时你真的应该考虑切换到当前的 React 方式,而不是试图维护旧的模式不是相当老到不可能相当容易地替换。你等待的时间越长,你就越难为自己做这件事。 @Felipe 不,他们是一样的【参考方案2】:

export default class App extends React.Component
    render() 
        return(
           <h1>its works</h1>
        );
    
;

这对我有用,检查这个 ReactJs CreateClass is not a function 因此它通过导出 React.component 而不是使用 React.createClass

【讨论】:

【参考方案3】:

在最新版本的 React 中,您会注意到 React.createClass 已从库中删除。最大的变化之一是您可以使用 javascript 类创建 React 组件。

【讨论】:

你能再解释一下吗?

以上是关于Render.js 文件(电子应用程序)中的“未捕获的 TypeError:React.createClass 不是函数”的主要内容,如果未能解决你的问题,请参考以下文章

vue渲染方式:render和template的区别

如何插入到Outlook电子邮件正文中的HTML文件

ObservableArray 中的第一个数组项

计算 OpenDocument 电子表格(ODS 文件)中的列数

通过电子邮件发送的 NSDictionary 文件与应用程序中的相同文件不同

Rails 4:EOFError:仅在开发中的任何电子邮件后到达文件结尾