CODEWITHSUNDEEP
reactjsreact-hooksreact-devtools
stever
stever

Reputation: 1241

React-devtools for hooks?

I use the react-devtools Chrome extension. When I set state using hooks (useState) to set an object in state, the actual setting of state seems to work fine. In devtools however, that state object shows that the Hooks > State has content ({...}), it also implies that the content is accessible . When I click on the “expand” (down arrow icon) nothing happens; I cannot view the object’s entries. Am I missing something or do devtools not work with hooks?

Tl:dr How do i use react-devtools to view Hooks state?

Upvotes: 4

Views: 3254

Answers (2)

Ala Eddine JEBALI
Ala Eddine JEBALI

Reputation: 7841

Update with React v16.8

React Hooks are now supported by React DevTools.

Upvotes: 1

Ryan Cogswell
Ryan Cogswell

Reputation: 81026

I see the same thing, though the issue is only with objects. Primitive values in state seem to show up fine.

It was logged as an issue 3 weeks ago: https://github.com/facebook/react-devtools/issues/1282

I'm surprised it hasn't already been addressed, but I suspect it will be addressed soon now that hooks are released.

I have also seen on Twitter that Brian Vaughn has been working on a rewrite of React devtools:

but it sounds like it will be a little while yet before that is ready for broad use.

Upvotes: 3

Related Questions