{"id":162,"hash":"29991aec8fe0c7bb311e65aa42121d102fc0a2d5aeca27a7d9eb1b3d8be921da","pattern":"getting error &quot;TypeError: Cannot read properties of null (reading &#39;useState&#39;)&quot; on useState usage react","full_message":"So I'm trying to use useState in my nextjs app, but as soon as I add in the line of code to initialize useState it throws a popup error with the error message: TypeError: Cannot read properties of null (reading 'useState')\n\nHere is a simplified version of my code:\n\nimport { useState } from 'react'\n\nexport default function Home() {\n    return (\n        <div>\n            <Transactions />\n        </div>\n    )\n}\n\nconst Transactions = () => {\n\n    const [state, setState] = useState('test')\n...\n}\n\nReact/Next versions I'm running:\n\n\"next\": \"12.1.5\",\n\"react\": \"18.0.0\",\n\"react-dom\": \"18.0.0\"\n\nScreenshot of error from chrome dev tools:\n\nAny thoughts on what's causing this? Thanks\n\nEDIT\nVery dumb bug on my end, issue was resolved by importing react...","ecosystem":"npm","package_name":"reactjs","package_version":null,"solution":"If you are using Next 13 App router this could be happening if you are using an async function\n\nWrong:\n\n\"use client\"\n\nexport default async function Page() {\n    const [variable, setVariable] = useState();\n}\n\nRight:\n\n\"use client\"\n\nexport default function Page() { //Remove Async Keyword\n        const [variable, setVariable] = useState();\n}","confidence":0.95,"source":"stackoverflow","source_url":"https://stackoverflow.com/questions/71898427/getting-error-typeerror-cannot-read-properties-of-null-reading-usestate-o","votes":58,"created_at":"2026-04-19T04:41:25.077012+00:00","updated_at":"2026-04-19T04:51:06.848958+00:00"}