К вашему сведению, «содержимое ячеек памяти в любой момент выполнения программы называется состоянием программы».

Я буду называть приложения на чистом JavaScript, созданные с использованием HTML / CSS, которые не используют библиотеку управления состоянием и которые не являются одностраничными приложением, как не реагирующие Приложение для оставшейся части этой статьи.

Состояние X является источником информации X в любой момент времени.

В приложении react состояние специально упоминается и используется, так что мы понимаем его. Вот вопросы, которые приходили мне в голову, когда я закончил изучать основы реакции:

  1. А что насчет этих нереагирующих приложений? Как мы поддерживаем их состояние?
  2. Действительно ли состояние имеет значение в веб-приложении?

Эти вопросы вдохновили меня исследовать эту тему и написать эту статью.

Давайте начнем с понимания того, что такое состояние в React и как им управлять

В React состояние связано с компонентом. Когда состояние компонента изменяется, React повторно отображает пользовательский интерфейс и создает новую модель DOM.

Состояние сохраняется в течение всего срока службы компонента, если оно явно не очищено.

Когда размер приложения увеличивается, передача состояний становится утомительной, поэтому мы создаем глобальный контейнер состояний с именем STORE.

Помня об этих концепциях состояния и хранилища, давайте продолжим и поймем, как они реализованы в нереагирующих приложениях.

Анализ нереагирующих приложений

Рассмотрим поле формы на странице, где мы что-то печатаем. Независимо от того, где мы перейдем на страницу, введенное нами значение все равно будет там, пока мы явно не очистим его. Это состояние этого поля формы. Несмотря на то, что мы не упоминаем состояние явно при разработке приложения, каждый элемент сохраняет свое локальное состояние.

Как сохраняются некоторые значения при переходе с одной страницы на другую в React?

Большинство приложений, созданных с помощью response, представляют собой одностраничные приложения . Это означает, что страницы динамически повторно отображают новый контент, а не загружают совершенно новую страницу.

Любые новые страницы или любые другие div, которые меняются с течением времени, будут содержаться внутри некоторого родительского компонента. Это означает, что он может иметь доступ к переменной состояния родительского компонента.

Что происходит, когда мы перемещаемся в нереагирующем приложении?

Что ж, мы теряем все данные о состоянии. Что происходит, когда мы обновляем заполненную, но еще не отправленную страницу формы? Получаем свежую форму, ничего не заполнено.

Когда мы переходим с одной страницы на другую, мы сбрасываем все данные о состоянии и загружаем новую страницу.

Но все нереагирующие приложения сохраняют некоторые данные даже после навигации, верно?

Да, это так. Например, информация для входа в систему, имя пользователя, предпочтения и т. Д. Но это не так просто, как с приложениями React. У нас нет STORE или глобального состояния, в котором будут храниться данные для нас.

Вместо этого мы используем кеш браузера, чтобы сохранять значения, необходимые для всего приложения. Существует несколько хранилищ данных на основе браузера, таких как хранилище сеансов, локальное хранилище, кеш и т. Д., Которые можно использовать для хранения данных приложения.

Что происходит с состоянием или магазином, когда мы обновляем приложение, которое реагирует на запросы?

Да, мы теряем все состояние или сохраняем данные. Несмотря на то, что мы поддерживаем хранилище, после обновления данные исчезают. Браузер все это сбрасывает.

Единственный способ сохранить данные даже для реагирующих приложений - это использовать хранилище браузера или методы кеширования.

Итак, в заключение, хотя слово «состояние» часто используется в реакции, в реакции нет ничего особенного, как и в случае с магазином. Каждое веб-приложение сохраняет свое локальное состояние.

Просто использовать те вещи, которые предоставляет какая-то библиотека (реагировать), вместо того, чтобы создавать что-то самостоятельно. И единственный способ сохранить данные в течение более длительного времени даже после обновления страницы или закрытия браузера - это использовать его функции.

Надеюсь, эта статья оказалась для вас полезной. Я хотел бы услышать твои мысли. 😇

Спасибо за прочтение. 😊

Ваше здоровье! 😃

Если вы найдете эту статью полезной, вы можете выразить свою признательность, нажав кнопку хлопка. Как говорится: «Когда мы даем с радостью и принимаем с благодарностью, все блаженны».