How to copy props in react dev tools

Today, while I was working on a bug, I found myself needing to copy a props of a React component, so I realized that the react dev tools did not have this functionality, after some searches, i found the solution.

EDIT: react dev tools has a pretty simple solution, thanks to Eugene

1. Open the ReactDevTools in Browser
2. Select the component that contains the props, in that you need copy (when you make this, the browser will be create a variable for save the component that you clicked, generally the name is $r)
3. Open the console, and save the prop in another variable
4. Use the copy method and "don't worry, be happy! :D" as me.

Cheers! 😗 😗 ❤️

Comments

[Ari Mourao]

Nice tip! Only now I'm having the opportunity to get deeper with React. This will be helpful.

[Fanny]

I'm really glad to hear that. thanks! ❤️ ❤️

[Eugene Karataev]

Nice tip! There is also an easier way - just right-click on an element and select 'Copy element props'.

[Fanny]

I didn't know, thank you! ❤️

[Ben Halpern]

Nice! This is gonna help a future searcher.

[Fanny]

yes, of sure! 😃

[Vijay Jangid]

Reminds me of my first encounter of the same situation. I was aware of $, $$, $1 in DOM element panel, but no idea about React.
Definately a help for fellow dev.

[Daniel Cunha (he/him)]

Nice one!

[Thayanne Luiza]

Cool!