Как вывести текст в Реакте?

Question

[Alekosh Akhosh]

Утро доброе,
У меня всё работало в одном app.js, пока руки не дошли до разбивания на компоненты.
Текст выводил через todo.text, но после деструктуризации не могу выводить текст

<ul>
  {
     notes.map(todo => <TodoItem key={todo.id} {...todo} remove={removeTodo} />) 
  }
</ul>

function TodoItem( { id, todo, remove } ) {
  return (
    <li key={id}>
      {todo} /* не могу получить todo.text*/
      <button onClick={() => remove(id)}>remove</button>
    </li >
  )
}

function clickHandler() {
    if (text.trim().length) {
      setNotes([
        ...notes,
        {
          id: uuid(),
          text
        }
      ])
    }
    setText('')
  }

Comments

[0xD34F]

Утро доброе

Вы обязаны убрать эту мерзость немедленно.

Текст выводил через todo.text, но после деструктуризации не могу выводить текст

function TodoItem( { id, todo, remove } ) {

Если у свойства имя text, то какого хрена пытаетесь доставать todo?

[Alekosh Akhosh]

0xD34F, Не знал что существует правило 3.4, исправлюсь, просто как-то не вежливо с моей стороны выходит;

Если у свойства имя text, то какого хрена пытаетесь доставать todo?

Ну а как мне тогда вывести текст? как?

[chemdev]

0xD34F,

то какого хрена

https://qna.habr.com/help/rules#3.4
https://qna.habr.com/help/rules#5.2

[chemdev]

правда теперь я по 5.16 могу пойти...

Answer 1

[Алексей Ярков]

TodoItem( { id, text, remove } )

Comments

[Alekosh Akhosh]

А, то есть вот так?
Я чего-то не понимаю в Деструктуризации, или можно взять свойство через ...rest оператор?

[chemdev]

Alekosh Akhosh, ты отправляешь не целый туду а распакованный в компонент. А в нем ожидаешь целый. На тайпскрипте написал бы и вопросов бы не возникло вообще.

[Alekosh Akhosh]

chemdev, спасибо за пояснение, и за совет