Hooks failure on functional component as root
See original GitHub issuesimple code like
import { h, render } from 'preact'
import { useState } from 'preact/hooks'
function Root(props) {
const [ c, setC ] = useState(0)
return h('h1', { onClick:()=>setC(c+1) }, `counter is ${c}`)
)
render(Root(), document.body)
fails with TypeError: Cannot read property '__H' of undefined
due to undefined currentComponent
within hooks
notice that currentComponent
is set on pre-render phase, but in case of Root
being functional hook must be initialized before any render.
Issue Analytics
- State:
- Created 4 years ago
- Comments:8 (4 by maintainers)
Top Results From Across the Web
Invalid hook call. Hooks can only be called inside of the body ...
Invalid hook call. Hooks can only be called inside of the body of a function component. This could happen for one of the...
Read more >How To Fix The React Hook is Called in Function Error
The official React documentation says that a valid React function component is one that “accepts a single 'props' object argument with data and ......
Read more >Technical Failure #1: React hooks dependencies
Let's imagine we have a root component with a state that changes frequently and a component connected to the backend.
Read more >Rules of Hooks - React
Don't call Hooks inside loops, conditions, or nested functions. Instead, always use Hooks at the top level of your React function, before any...
Read more >Invalid hook call. Hooks can only be called inside the body of ...
The error "Invalid hook call. Hooks can only be called inside the body of a function component" occurs for multiple reasons: Having a...
Read more >Top Related Medium Post
No results found
Top Related StackOverflow Question
No results found
Troubleshoot Live Code
Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start FreeTop Related Reddit Thread
No results found
Top Related Hackernoon Post
No results found
Top Related Tweet
No results found
Top Related Dev.to Post
No results found
Top Related Hashnode Post
No results found
Top GitHub Comments
Just noticed that many issues were similar to mine, but in other situations. Users had troubles with that and minified CDN versions of preact are little bit mysterious on that. Maybe some doc mentions on that would be also useful. Ok, thanks for your lightning fast and valuable support…and for great preact.
No it can’t, do you have a use case where you would want to use a hook outside of
render
?Do note that
preact/debug
warns you for these.