Question

我最近开始学习反应。我无法理解：

this.props.message.text

我知道message是一个带有键值对的对象，键是text。但我的问题是当我们想要将道具传递给组件时：

<Component message={message}>

我的问题是我们为什么要写message={message}？

为什么我们不应该写message={message.text}以便我们知道我们想要text？

我们如何知道text对象中的message？

Answer 1

这取决于Component正在做什么。我们假设您的消息对象中有更多属性，例如：

{
  text: 'this is my message',
  author: 'odiwxe',
  sentAt: '2018-05-30T12:30:00'
}

然后您的Component可能需要所有这些信息才能显示它，以便您可以像以下那样传递它：

<Component message={message}>

否则，如果您的Component仅关注消息文本，则可能会将其更改为以下内容：

<Component messageText={message.text}>

由你决定！

Answer 2

实际上，它没有。当我们想要消息的文本时，我们必须使用以这种方式传递给子组件的props来访问数据：

{this.props.message.text}

因此，当任何子组件需要由其父级发送的数据时，您需要告诉您需要子级数据的对象名称。例如：

<Parent Component {

//Some code//


<ChildComponent propsName = {propsData}
}

然后，可以在以下形式的子组件中访问此数据：

<ChildComponent

{this.props.propsName}

}

因此，这是将数据从父级传递给子级的方式，为实现此目的，您需要使用道具。

//更新

它已经将任务用于任务但是任务。 id用于密钥，因为他们只想在那种情况下使用密钥而任务对象在组件中用于其他一些功能，比如打印写入的文本不能单独从任务 .id获取。

据我说，任务对象有点像这样：

task{
"text": "value"
}