我以前无法弄清楚该错误的解决方法。如果我试图创建构造函数。
以前我已经两次导入React 从'react'导入React; 从'react'导入React,{Component}; 因为那里有错误。为了更正它,我从代码中删除了1个导入。
import React,{Component} from 'react';
import './App.css';
class App extends Component() {
constructor(props){
}
render() {
return (
<div className="App">
<table className="titleBar">
<tbody>
<tr>
<td>
<img alt="app icon" width="50" src="primary_green.svg"/>
</td>
<td width="8"/>
<td>
<h1>MovieDb Search</h1>
</td>
</tr>
</tbody>
</table>
<input style={{
fontSize: 24,
display: 'block',
width: '99%',
paddingTop: 8,
paddingBottom: 8,
paddingLeft: 16
}} placeholder="Enter Search Term"/>
</div>
);
}
}
export default App;
×
TypeError: Unable to set property 'props' of undefined or null reference
Component
C:/Users/Admin/Desktop/React_Projects/movies_search/node_modules/react/cjs/react.development.js:298
295 | */
296 |
297 | function Component(props, context, updater) {
> 298 | this.props = props;
| ^
299 | this.context = context; // If a component has string refs, we will assign a different object later.
300 |
301 | this.refs = emptyObject; // We initialize the default updater but the real one gets injected by the
View compiled
./src/App.js
C:/Users/Admin/Desktop/React_Projects/movies_search/src/App.js:6
3 | import './App.css';
4 |
5 |
> 6 | class App extends Component() {
7 | constructor(props){
8 |
9 | }
View compiled
__webpack_require__
C:/Users/Admin/Desktop/React_Projects/movies_search/webpack/bootstrap:781
778 | };
779 |
780 | // Execute the module function
> 781 | modules[moduleId].call(module.exports, module, module.exports, hotCreateRequire(moduleId));
| ^
782 |
783 | // Flag the module as loaded
784 | module.l = true;
View compiled
fn
C:/Users/Admin/Desktop/React_Projects/movies_search/webpack/bootstrap:149
146 | );
147 | hotCurrentParents = [];
148 | }
> 149 | return __webpack_require__(request);
| ^
150 | };
151 | var ObjectFactory = function ObjectFactory(name) {
152 | return {
View compiled
./src/index.js
http://localhost:3000/static/js/main.chunk.js:263:22
__webpack_require__
C:/Users/Admin/Desktop/React_Projects/movies_search/webpack/bootstrap:781
778 | };
779 |
780 | // Execute the module function
> 781 | modules[moduleId].call(module.exports, module, module.exports, hotCreateRequire(moduleId));
| ^
782 |
783 | // Flag the module as loaded
784 | module.l = true;
View compiled
fn
C:/Users/Admin/Desktop/React_Projects/movies_search/webpack/bootstrap:149
146 | );
147 | hotCurrentParents = [];
148 | }
> 149 | return __webpack_require__(request);
| ^
150 | };
151 | var ObjectFactory = function ObjectFactory(name) {
152 | return {
View compiled
0
http://localhost:3000/static/js/main.chunk.js:390:1
__webpack_require__
C:/Users/Admin/Desktop/React_Projects/movies_search/webpack/bootstrap:781
778 | };
779 |
780 | // Execute the module function
> 781 | modules[moduleId].call(module.exports, module, module.exports, hotCreateRequire(moduleId));
| ^
782 |
783 | // Flag the module as loaded
784 | module.l = true;
View compiled
checkDeferredModules
C:/Users/Admin/Desktop/React_Projects/movies_search/webpack/bootstrap:45
42 | }
43 | if(fulfilled) {
44 | deferredModules.splice(i--, 1);
> 45 | result = __webpack_require__(__webpack_require__.s = deferredModule[0]);
| ^
46 | }
47 | }
48 | return result;
View compiled
webpackJsonpCallback
C:/Users/Admin/Desktop/React_Projects/movies_search/webpack/bootstrap:32
29 | deferredModules.push.apply(deferredModules, executeModules || []);
30 |
31 | // run deferred modules when all chunks ready
> 32 | return checkDeferredModules();
| ^
33 | };
34 | function checkDeferredModules() {
35 | var result;
View compiled
Global code
http://localhost:3000/static/js/main.chunk.js:1:2
This screen is visible only in development. It will not appear if the app crashes in production.
Open your browser’s developer console to further inspect this error.
答案 0 :(得分:0)
在定义App
时,您要调用Component
作为一个函数。更改
class App extends Component() {
到
class App extends Component {
此外,如果constructor
只是空的,则将其删除。