---
title: "React 18 String Refs Migration - Air Market"
description: "Your class components still name refs with a string, and React either warns about it or has dropped support. This walks through the replacement for each shape it takes: one ref, several refs, refs in…"
canonical: "https://airmarket.ai/app/react18-string-refs"
---

[Air Market](/) / [Developer Tools](/category/devtools) / React 18 String Refs Migration

Skill by [GitHub](/@github)

# React 18 String Refs Migration

Trade this.refs for createRef without breaking the tricky cases

## What this does

Your class components still name refs with a string, and React either warns about it or has dropped support. This walks through the replacement for each shape it takes: one ref, several refs, refs in a list, callback refs, refs handed to a child. Read it before you start the edit, especially if lists are involved.

### Top 3 things it does for you

- Convert string refs to React.createRef in class components
- Handle refs inside lists, where the pattern gets tricky
- Sort out refs passed down to child components

## Information

**React 18 String Refs Migration at a glance**

|  |  |
| --- | --- |
| Kind | Skill |
| Publisher | [GitHub](/@github) |
| Category | [Developer Tools](/category/devtools) |
| Works with | Agent Skills - an open standard supported by 40+ agents |
| Size | 9 KB |
| Licence | MIT |
| Repository | [github/awesome-copilot](https://github.com/github/awesome-copilot/tree/90921cc46f4e452ea379e70884d60ec25263f16a/skills/react18-string-refs) |
| GitHub stars | 38,187 (as of Nov 2026) |
| Installs | 743, counted by skills.sh (Nov 2026) |

## Security report

**Verified.** AIR scanned this exact version of React 18 String Refs Migration and flagged nothing. AIR's verdict: **safe**.

**What React 18 String Refs Migration's check was run against**

|  |  |
| --- | --- |
| Commit | 90921cc46f4e452ea379e70884d60ec25263f16a |
| Content hash | 8355c9ff407c947e5ce6ef36df1c1d98f6d9f121b505ba8819378e563d310ca6 |
| Files read | [Browse the files at this exact commit](https://github.com/github/awesome-copilot/blob/90921cc46f4e452ea379e70884d60ec25263f16a/skills/react18-string-refs/SKILL.md) |

A scan is named by the exact content it read, not by a version number. A different version is a different artifact, and nothing here applies to a version AIR has not scanned.

[Read the full security report for React 18 String Refs Migration](/security/react18-string-refs)

## About React 18 String Refs Migration

String refs - ref="name" paired with this.refs.name - are on the way out. This gives the migration patterns to React.createRef() for class components, in before-and-after form.

It covers the shapes the problem takes in real code: a single element ref, several refs in one component, refs inside lists, callback refs, and refs passed to child components. The multiple-refs-in-a-list case is called out as the one people most often get wrong.

It applies to a React 18.3.1 migration, where string refs warn, and to a React 19 migration, where they are removed. Read it before writing the ref migration code.

## What's inside

- SKILL.md - instructions
- references/patterns.md - reference

## Questions

### Is React 18 String Refs Migration safe to install?

AIR scanned this exact version of React 18 String Refs Migration and flagged nothing. AIR's verdict: safe. The verdict is named by the content that was read, at commit 90921cc46f4e, so it cannot drift onto a version nobody scanned. The full report is at https://airmarket.ai/security/react18-string-refs.

### How do I install React 18 String Refs Migration?

Open https://airmarket.ai/app/react18-string-refs on Air Market and use the install action: Air Market hands Claude a prompt naming this exact skill, and Claude sets it up. Source, pinned to the exact commit this listing describes: https://github.com/github/awesome-copilot/tree/90921cc46f4e452ea379e70884d60ec25263f16a/skills/react18-string-refs. Install from that link, not the branch.

## Related on Air Market

- [More Developer Tools listings](/category/devtools)
- [Everything by GitHub](/@github)

---

Canonical URL: <https://airmarket.ai/app/react18-string-refs>