在 useState 使用反应时出现错误“TypeError：无法读取 null 的属性（读取 'useState'）”答案

【问题标题】：getting error "TypeError: Cannot read properties of null (reading 'useState')" on useState usage react在 useState 使用反应时出现错误“TypeError：无法读取 null 的属性（读取 'useState'）”
【发布时间】：2022-06-18 15:13:01
【问题描述】：

所以我试图在我的 nextjs 应用程序中使用 useState，但是一旦我添加了初始化 useState 的代码行，它就会抛出一个带有错误消息的弹出错误：TypeError: Cannot read properties of null (reading 'useState')

这是我的代码的简化版本：

import { useState } from 'react'

export default function Home() {
    return (
        <div>
            <Transactions />
        </div>
    )
}



const Transactions = () => {

    const [state, setState] = useState('test')
...
}

我正在运行的 React/Next 版本：

"next": "12.1.5",
"react": "18.0.0",
"react-dom": "18.0.0"

chrome 开发工具的错误截图：

对造成这种情况的原因有什么想法吗？谢谢

编辑我的问题非常愚蠢，通过导入反应解决了问题......

【问题讨论】：

我无法使用您的代码的简化版本进行复制，因此问题很可能出在细节上。你能发布一个完整的例子吗？
回购链接：github.com/bracesproul/Budget-Tracker/blob/main/pages/…

标签： javascript reactjs next.js use-state

【解决方案1】：

所以我分叉并克隆了您的 github 存储库，但无法在我的系统上重现该错误。我发现的一件事是在您导入的导航栏组件中

import Link from 'next/Link'

这给我一个错误，直到我可以将其更改为下一个/链接为小写

import Link from 'next/link'

我建议做的是重新安装 react，只需使用一个简单的 npm 命令来查看是否可以解决您的问题。如果不告诉我！

npm uninstall react
npm install react@latest

【讨论】：

【解决方案2】：

只需在 Home 函数中定义 State

【讨论】：