React Hook "useState" 在函数 "app" 中被调用,它既不是 React 函数组件也不是自定义 React Hook 函数

新手上路,请多包涵

我正在尝试使用反应钩子来解决一个简单的问题

const [personState,setPersonState] = useState({ DefinedObject });

具有以下依赖项。

 "dependencies": {
    "react": "^16.8.6",
    "react-dom": "^16.8.6",
    "react-scripts": "3.0.0"
}

但我仍然收到以下错误:

./src/App.js

第 7 行:

React Hook “useState” 在函数 “app” 中被调用,它既不是 React 函数组件也不是自定义 React Hook 函数 react-hooks/rules-of-hooks

第 39 行:

“状态”未定义

无非定义

搜索关键字以了解有关每个错误的更多信息。

组件代码如下:

 import React, {useState} from 'react';
import './App.css';
import Person from './Person/Person';

const app = props => {
    const [personState, setPersonSate] = useState({ person:[ {name:'bishnu',age:'32'}, {name:'rasmi',age:'27'}, {name:'fretbox',age:'4'} ], });
    return (
        <div className="App">
            <h2>This is react</h2>
            <Person name={personState.person[1].name} age="27"></Person>
            <Person name={personState.person[2].name} age="4"></Person>
        </div> );
    };
    export default app;

人员组件

import React from 'react';

const person = props => {
    return(
        <div>
            <h3>i am {props.name}</h3>
            <p>i am {props.age} years old</p>
            <p>{props.children}</p>
        </div>
    )
};

export default person;

原文由 Bishnu 发布,翻译遵循 CC BY-SA 4.0 许可协议

阅读 553
1 个回答

尝试将“应用程序”大写

const App = props => {...}

export default App;

在 React 中,组件需要大写,自定义钩子需要以 use

原文由 YUKI 发布,翻译遵循 CC BY-SA 4.0 许可协议

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进