Давайте рассмотрим глупые ошибки, которые вы, скорее всего, сделаете при написании React на каждом этапе написания реакции разработчика, не углубляясь в него.
Ошибки новичка
В этот момент или этап вы совершите «самую» глупейшую из ошибок, и поверьте мне, от этого никуда не деться. Но вот несколько, которые вы бы сделали хотя бы один или два раза.
Ошибка вызова компонента
React — это библиотека javascript на основе компонентов, что означает, что при написании мы записываем их в небольшие файлы, а затем соединяем их в другом файле. Этот процесс известен как процесс вызова компонента, да, импорт и экспорт компонентов, вот что это такое.
ГЛУПАЯ ОШИБКА
Учитывая приведенные выше представления, заметили разницу? Если вы этого не сделаете (ухмыльнитесь), то вы добросовестный член категории начинающих реагировать, а в реакции правильный способ вызова компонентов — это изображение справа, где компонент «Приветствие» начинается с заглавной буквы «G». .
Ошибка экспорта и импорта компонентов
Импорт именованных экспортов в качестве экспортов по умолчанию — еще одна глупая ошибка, которую вы можете совершить. Ниже приведена разница между именованным компонентом экспорта и компонентом экспорта по умолчанию.
ГЛУПАЯ ОШИБКА
Вы бы импортировали именованный компонент экспорта как компонент по умолчанию и наоборот иногда, по крайней мере, один или два раза. Итак, в надежде избежать этого ниже приведен правильный способ их импорта, а разница заключается в заключении компонента в фигурные скобки при импорте для именованного экспорта.
Ошибка мутации состояния
учитывая приведенное выше представление кода, мы мутируем count
state с функцией setCount
, используя хук usestate
, и все, что он делает, это когда мы нажимаем кнопку, это увеличивает значение счетчика на единицу.
ГЛУПАЯ ОШИБКА
Вы, вероятно, думаете, что приведенное выше представление кода правильно, конечно, с точки зрения выполнения. Но всякий раз, когда есть состояние, которое будет мутировать в зависимости от его предыдущего значения, не следует обращаться к такому состоянию, используя его значение по умолчанию, и причина в том, что когда значение состояния по умолчанию изменяется, оно не изменяется немедленно, а ожидает выполнение всех кодов в компоненте, а затем после его изменения и повторного рендеринга всего компонента.
Итак, как нам исправить это, вместо того, чтобы использовать функцию count
state для доступа к значению, мы можем фактически получить точное значение, используя функцию обратного вызова, которая принимает ключевое слово в качестве аргумента, в этом случае мы используем значение prev
таким образом, чтобы состояние функция будет использовать значение состояния в реальном времени, см. представление кода ниже.
Заключение
Не волнуйтесь, вы не одиноки, каждый совершал эти ошибки хотя бы один или два раза.
Жду уточняющих вопросов. Так же прошу критиковать и исправлять. Поделиться Спасибо.