Was sind die gültigen Symbole für einen React 'Schlüssel'?

Question

Was sind die gültigen Symbole für eine React Key-Stütze als solche?

<div key="can i use spaces for example?"></div> 

In meinem Fall möchte ich als Schlüssel

const links = [ 
    { 
     label: 'foo label', 
     href: 'https://example.com', 
    }, 
    { 
     label: 'bar label', 
     href: 'https://example.com', 
    } 
] 

links.map(
    link => (<a key={link.href} href={link.href}>{link.label}</a>) 
); 

eine URL verwenden Ist diese gültig? Ich dachte, dass ich eine Hash-Funktion verwenden könnte, um den href zuerst durchzulassen, aber dies ist ein sinnloser Schritt, wenn ein Zeichen in einem Schlüsselwert garantiert gültig ist.

Der Grund, warum ich frage, ist, dass ich kein Beispiel in dem Dokument finden kann, das ein nicht-alphanumerisches Zeichen für den Schlüssel verwendet, und auch explizit sagt, dass, wenn Sie keine ID haben Verwenden Sie als Schlüssel für das Objekt, das Sie rendern können hash some part of it to make a key. Obwohl dies daran liegen könnte, dass Sie keine sehr langen Schlüssel verwenden sollten und daher den Inhalt zuerst hasen sollten, um seine Größe zu reduzieren, scheint die gesamte Dokumentation implizit zu sagen, dass nur alphanumerische Zeichen als Schlüssel verwendet werden sollten.

Answer 1

Voraussetzungen für die Schlüssel des React sind am besten in der Dokumentation beschrieben, für reconciliation

In der Praxis einen Schlüssel zu finden, nicht wirklich schwer. Die meiste Zeit hat das Element, das Sie anzeigen werden, bereits eine eindeutige ID. Wenn das nicht nicht der Fall ist, können Sie eine neue ID-Eigenschaft zu Ihrem Modell hinzufügen oder einige Teile des Inhalts hash , um einen Schlüssel zu generieren. Denken Sie daran, dass der Schlüssel nur hat, um unter seinen Geschwistern eindeutig zu sein, nicht global eindeutig.

So soll der Schlüssel eindeutig sein (unter seinen Geschwistern) und stabil.

Ihr Beispiel ist daher eine gute Passform. Räume sollten auch gut sein.