Я не мог найти хорошего объяснения по этому поводу.
Таким образом, вы можете использовать реквизит следующими способами:
1.
export default function AppHeader({ somethingImportant }) {
return <div>{somethingImportant}</div>
}
или
2.
export default function AppHeader(props) {
const { somethingImportant } = props
return <div>{somethingImportant}</div>
}
Я не могу точно сказать разницу между первым способом использования реквизита в дочернем компоненте и вторым способом.
Связано ли это с повторным использованием компонентов в других родительских компонентах??
Заранее спасибо, ребята!
Первый способ 2 в 1 :)
они почти одинаковы, но в подходе номер один, когда вы используете компонент AppHeader, ваш ide может намекнуть вам, что этот компонент нуждается в какой-то важной опоре (если вы используете webStorm или phpStorm, вы можете нажать ctl + пробел там, где вы использовали компонент, и посмотреть эта опора)
Это одно и то же. Первый синтаксис является просто ярлыком для второго, так как вы сохраняете строку кода. Посмотрите разделы «Базовое назначение» и «Распаковка свойств из объектов, переданных в качестве параметра функции» в разделе «Деструктуризация объекта» на Страница документации Mozilla.