2017-01-30 43 views
8

我想传递一个名称为“”的参数给一个反应组件,它不起作用。如果我使用“keyy”而不是“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

键帮助阵营识别哪些项目已经改变,添加或移除。应该给数组内的元素赋予元素一个稳定的标识。在阵列中使用的键在他们的兄弟姐妹中应该是唯一的。但是,他们不需要全球独一无二。 Keys可以作为React的提示,但不会传递给组件。如果您的组件需要相同的值,请将其明确传递为具有不同名称的道具。

0

key是保留字。

here

键帮助阵营识别哪些项目已经改变,添加或移除。键应该赋予数组内的元素以给元素一个稳定的标识:

选择一个键的最好方法是使用一个字符串来唯一标识其兄弟中的列表项。大多数情况下,您会将数据中的ID用作关键字。

This也不错,并解释了为什么阵营使用key PARAM,什么是德好处。您会发现key param是React 对帐算法的核心。


除了key PARAM很少有你不应该使用更多的保留字,如:

refdangerouslySetInnerHTML

后来一个dangerouslySetInnerHTML您使用,而不是DOM innerHTML

请登录here了解更多详情。