mirror of
https://github.com/jbranchaud/til
synced 2026-01-06 16:48:01 +00:00
Add Visually Select A React Component For Inspection as a react til
This commit is contained in:
@@ -10,7 +10,7 @@ smart people at [Hashrocket](http://hashrocket.com/).
|
|||||||
For a steady stream of TILs from a variety of rocketeers, checkout
|
For a steady stream of TILs from a variety of rocketeers, checkout
|
||||||
[til.hashrocket.com](https://til.hashrocket.com/).
|
[til.hashrocket.com](https://til.hashrocket.com/).
|
||||||
|
|
||||||
_604 TILs and counting..._
|
_605 TILs and counting..._
|
||||||
|
|
||||||
---
|
---
|
||||||
|
|
||||||
@@ -432,6 +432,7 @@ _604 TILs and counting..._
|
|||||||
- [Quickly Search For A Component With React DevTools](react/quickly-search-for-a-component-with-react-devtools.md)
|
- [Quickly Search For A Component With React DevTools](react/quickly-search-for-a-component-with-react-devtools.md)
|
||||||
- [Rendering Multiple Nodes With Fragments](react/rendering-multiple-nodes-with-fragments.md)
|
- [Rendering Multiple Nodes With Fragments](react/rendering-multiple-nodes-with-fragments.md)
|
||||||
- [Use A Ref To Autofocus An Input](react/use-a-ref-to-autofocus-an-input.md)
|
- [Use A Ref To Autofocus An Input](react/use-a-ref-to-autofocus-an-input.md)
|
||||||
|
- [Visually Select A React Element For Inspection](react/visually-select-a-react-element-for-inspection.md)
|
||||||
|
|
||||||
### Ruby
|
### Ruby
|
||||||
|
|
||||||
|
|||||||
13
react/visually-select-a-react-element-for-inspection.md
Normal file
13
react/visually-select-a-react-element-for-inspection.md
Normal file
@@ -0,0 +1,13 @@
|
|||||||
|
# Visually Select A React Element For Inspection
|
||||||
|
|
||||||
|
Similar to the _Elements_ tab of Chrome devtools, the [React devtools
|
||||||
|
extension](https://github.com/facebook/react-devtools) provides a visual
|
||||||
|
element selector to make it easier to inspect an element you can see in the
|
||||||
|
browser.
|
||||||
|
|
||||||
|

|
||||||
|
|
||||||
|
Open the React devtools, click the crosshair icon, hover around the browser
|
||||||
|
until the element you are looking for is visually highlighted, and then
|
||||||
|
click. The React component hierarchy will be expanded to reveal that
|
||||||
|
element. You can now inspect it or quickly navigate to nearby elements.
|
||||||
Reference in New Issue
Block a user