Многоуровневый реквизит в React
Я недавно начал учиться реагировать. Я не могу этого понять:
this.props.message.text
Я знаю, что message - это объект с парой ключ-значение в нем, ключом является text.
Но моя проблема в том, что мы хотим передать опору компоненту:
<Component message = {message}>
У меня вопрос: зачем писать message = {message}?
Почему бы нам не написать message = {message.text} вместо этого, чтобы мы знали, что нам нужен text?
Как он узнает, что нам нужен text в объекте message?
![Безумие обратных вызовов в javascript [JS]](https://i.imgur.com/WsjO6zJb.png)
Ответы 2
Это зависит от того, что делает Component. Допустим, у вас есть больше свойств в объекте сообщения, например:
{
text: 'this is my message',
author: 'odiwxe',
sentAt: '2018-05-30T12:30:00'
}
Затем вашему Component может понадобиться вся эта информация, чтобы отобразить ее, чтобы вы могли передать ее, как вы это сделали, например:
<Component message = {message}>
В противном случае, если ваш Component заботится только о тексте сообщения, вы потенциально можете изменить его на что-то вроде этого:
<Component messageText = {message.text}>
Тебе решать!
Спасибо. Для контекста это ссылка: meteor.com/tutorials/react/components Моя проблема заключается в функции renderTasks в файле App.js. Он использовал task._id для идентификатора, но для текста задачи он написал только task.
Да, вы правы - на самом деле нет необходимости передавать всю задачу в случае учебника, поскольку он использует только свойство text. Однако передача всего объекта task позволяет легко изменять компонент Task, если к объекту добавляются дополнительные свойства, без необходимости изменять родительский элемент для передачи новых свойств.
На самом деле это не так. Когда нам нужен текст сообщения, мы должны получить доступ к данным, используя реквизиты, переданные дочернему компоненту следующим образом:
{this.props.message.text}
Итак, когда любому дочернему компоненту требуются данные, которые отправляются его родителем, вам необходимо указать имя объекта, в котором вам требуются данные в дочернем элементе. Например:
<Parent Component {
//Some code//
<ChildComponent propsName = {propsData}
}
Тогда эти данные будут доступны в дочернем компоненте в таком виде:
<ChildComponent
{this.props.propsName}
}
Итак, это способ передачи данных от родителя к потомку, и для этого вам нужно использовать реквизиты.
//Update
Он использовал задачу для задачи, но task.id для ключа, потому что в этом случае им просто нужен ключ, а объект задачи используется в компоненте для некоторых других функций, таких как печать текста, написанного в том, что не может быть получено из задачи.id индивидуально.
По моему мнению, объект задачи примерно такой:
task{
"text": "value"
}
Спасибо. Пожалуйста, прочтите мой комментарий к ответу Христоса Димитруласа на этот вопрос. Вы можете это проверить и помочь мне?
Я думаю, это то, что вы ищете.
Компонент ожидает сообщение, а не только текст сообщения. Почему? Не знаю, что из контекста невозможно угадать, кроме как в целом вы даете компонентам то, что они ожидают.