Обзор

Сегодня был интересный и немного сложный день. Я начинаю понимать, насколько модульным и динамичным может быть React. Узнав о взаимодействии между компонентами в нескольких файлах, свойствах и состоянии, я как бы поверхностно понимаю, что происходит, но я все еще не до конца понял

Индикатор

Ключевые выводы

  1. Именованные экспорты. В React каждый файл Javascript по умолчанию невидим для других файлов Javascript, поэтому компоненты, визуализирующие другие компоненты, — отличный способ добавить взаимодействие между файлами. Один из способов сделать это — использовать именованный экспорт, при котором мы можем экспортировать класс, переменную, функцию и т. д. из одного файла js и импортировать их в другой файл js.
  2. Есть ТОЛЬКО два способа для приложения реагировать на получение динамической информации: реквизиты и состояние.
  3. Props: у каждого компонента по умолчанию есть реквизит, который представляет собой объект, содержащий информацию об этом компоненте. Дополнительную информацию можно передать свойствам, добавив атрибуты в экземпляр компонента.
  4. Реквизиты, кажется, обеспечивают своего рода обратный канал для передачи информации в компонент извне во время его рендеринга. Они в основном используются для передачи информации от одного компонента к другому. Кроме того, реквизиты каждого компонента имеют свойство с именем children, к которому обращается this.props.children.
  5. Состояние. Реквизиты помогают передавать информацию компоненту извне, а состояние помогает обновлять информацию внутри компонента.
  6. this.setState(): эту команду можно использовать для изменения состояния компонента. Примечание — эта команда при выполнении также автоматически вызывает render() при изменении состояния компонента.

Пробелы

  1. Хотя я начинаю ценить модульность React, я совершенно не понимаю, как все должно быть структурировано. Например, из какого файла следует экспортировать компонент, в какой файл его следует импортировать и отображать в DOM и т. д.
  2. Я также немного не понимаю, как должны быть настроены Props и State и когда мы что используем?
  3. Я плохо понимаю понятие «это». Конкретно почему? и когда? мы его используем.
  4. Наконец, синтаксис для свойств и состояния кажется немного сложным на данный момент. Здесь нужно больше практики.

Вывод

Codecademy делает хорошую работу, предоставляя обзор сложных тем на очень высоком уровне. Однако в данный момент я чувствую, что за последние 5 дней я получил много новой информации. Мне не терпится поработать над быстрым проектом, чтобы закрепить эти знания.

Кстати, был проект, разбитый на 4 части, над которым я должен был работать по мере изучения этих тем. Но, к сожалению, Codecademy лишила меня доступа к проектам, поскольку я превысил крайний срок для иммерсивной программы, несмотря на то, что заплатил за этот курс 200 долларов США! :/

В любом случае, надеюсь наверстать упущенное из других источников — подробнее об этом в ближайшие несколько дней.

Это все, что у меня есть! Увидимся завтра на Дне 6 — Codecademy React.js | Передача информации 1, 2 и 3

Если вы наткнулись на эту страницу, прочитайте, как я начал этот челлендж и о чем он вообще → здесь.