2017-01-30 13 views
8

名前が "キー"のパラメータを反応コンポーネントに渡そうとしていますが反応しません。私が "keyy"を "key"の代わりに使用すると、それは動作します。コンポーネント "react"に "key"パラメータを渡します

「キー」は制限されたキーワードであり、パラメータの名前として使用することはできません。

本当ですか?

私の例である:

render() { 
    <MyComponent key='apple' 
       keyy='pear'> 
} 
+0

予約されているプロパティを使用すると、コンソールから明示的に通知されるはずです – ComethTheNerd

答えて

8

はい、それは本当である、キーが制限されたキーワードであると小道具として伝播されません。


キーが反応することがヒントとなりますが、彼らはあなたのコンポーネントに渡されません。あなたのコンポーネントに同じ値が必要な場合は、別の名前で小道具として明示的にそれを渡します。上記の例では

const content = posts.map((post) => 
    <Post 
    key={post.id} 
    id={post.id} 
    title={post.title} /> 
); 

を、ポスト・コンポーネントは、小道具をprops.idを読むことはできませんが。キー。

続きを読むdocs

3

はいkeyキーワードで予約されているが、これはHTML要素を識別するように反応することで使用され、それが一意である必要があります。パフォーマンスを向上させるのに役立ちます。 各子供にキーを追加する必要があります。 このようにReactは最小のDOM変更を処理できます。

From React Docs

キーが変更されているアイテム識別リアクト役立つ、追加されている、または削除されます。要素に安定したアイデンティティを与えるために、配列内の要素にキーを与える必要があります。配列内で使用されるキーは、兄弟間で一意でなければなりません。しかし、彼らは世界的にユニークである必要はありません。キーはReactへのヒントとして機能しますが、コンポーネントに渡されることはありません。コンポーネントに同じ値が必要な場合は、別の名前のプロップとして明示的に渡します。

0

keyは予約語です。 hereから

キーが変更されているアイテム識別リアクト役立つ、追加されている、または削除されます。要素を安定したアイデンティティにするために、配列内の要素にキーを与える必要があります。

キーを選択する最も良い方法は、兄弟間でリスト項目を一意に識別する文字列を使用することです。多くの場合、データのIDをキーとして使用します。

Thisも良いですし、keyのparamを使用して反応し、TE利点は何である理由を説明します。keyパラメータは、React 調整アルゴリズムの中核であることがわかります。


別にkeyのparamからのようなあなたが使用してはならないいくつかのより多くの予約語があります。

refdangerouslySetInnerHTML

は後で1 dangerouslySetInnerHTML使用する代わりに、DOM innerHTML

詳細については、hereをご確認ください。

関連する問題