リアクションキーの有効シンボルは何ですか

Question

リアクションキーの有効なシンボルは何ですか？私は、キー

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>) 
); 

としてURLを使用したい私の場合は

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

これは有効ですか？私は最初にhrefを渡すためにいくつかのハッシュ関数を使うことができると考えていましたが、キー値でどの文字も有効であることが保証されていれば無意味なステップです。

私が尋ねるのは、キーに非英数字を使用する例を見つけることができず、IDを持たないレンダリングしているオブジェクトのキーとして使用してください。hash some part of it to make a key。これは、長いキーは使用しないでください。内容を最初にハッシュしてサイズを切り捨てる必要があるため、暗黙的に英数字のみをキーとして使用するように文書全体が暗示しているようです。リアクトキーの

Answer 1

要件は、最高のキーを見つけることは本当に難しいことではありません、実際にはreconciliation

のドキュメントに記載されています。たいていの場合、あなたが表示しようとしている 要素にはすでに一意のIDがあります。その場合、 の場合は、モデルに新しいIDプロパティを追加するか、コンテンツの一部を にハッシュしてキーを生成することができます。そのキーは、唯一のグローバルなユニークではなく、兄弟間で一意であることが であることを忘れないでください。

したがって、キーは（兄弟の中で）ユニークで安定している必要があります。

したがって、あなたの例は適切です。スペースもうまくいくはずです。