Advertisement
the0938

Untitled

Mar 23rd, 2021
117
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 2.64 KB | None | 0 0
  1. ## Не всегда соблюдаются базовые принципы хранилищ
  2.  
  3. Итак. Тут нужна теория.
  4.  
  5. Фронт - это конечный детерминированный автомат (гуглить). Его узлы - это снапшоты Virtual DOM, переходы между узлами - события. Когда мы юзаем MobX, узлами становятся @observable и @computed, а переходами - @action. У нас же @action подчас используется так, будто это обычный метод класса.
  6.  
  7. Поясню. Вот есть у нас модуль `repay` (оплата). По флоу пользователь выбирает тип платежа (полное погашение либо частичное). В этот момент мы сохраняем его выбор (каким именно образом не важно - хоть в localStorage, хоть в состояние истории браузера). Далее, на следующей странице нам нужно его достать, чтобы дёрнуть метод для оплаты займа.
  8.  
  9. Как сделано: в action `pay` мы считываем из `localStorage` сохранённое значение, отправляем на бэк. Казалось бы, всё норм. Но на той же странице происходит проверка доступа (дескать, не ещё выбрал тип платежа - иди нахуй, нечего руками в адресную строку адреса вбивать). Там мы тоже лезем в `localStorage`, чтобы получить сохранённый тип. На первый взгляд - никаких проблем. Но тут нарушается принцип конечного автомата. Мы как бы "размазываем" состояние между несколькими source of truth - хранилищем и `localStorage`.
  10.  
  11. Как должно быть: при componentDidMount страницы мы дёргаем действие `touch`. Оно инициализирует хранилище (заставляет его забрать из localStorage) сохранённые данные. Затем мы уже работаем с ними - без постоянного чтения из WebAPI. При такой схеме действие меняет состояние. Source of truth один.
  12.  
  13. В глаза бросилось именно `repay`, но, возможно, есть где-нибудь ещё.
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement