Extract React function component

Extract JSX element or fragment into a React Function Component.

Refactoring (Extract)
P42 for VS Code
Extract React function component

Why is this refactoring helpful?

Extracting a React component helps you modularize your code. The extracted component can be reused, documented, and tested separately. The original code becomes more concise and readable, especially if you choose a descriptive component name.

Limitations

P42 analyzes only the file that you are currently working on. Type information might be accurate and the parameter type signature of the extracted Function Component might contain unknown types.

Configuration

Related Code Assists

Learn More

Available In