Я работаю над реагирующей/ретрансляционной системой управления контентом. Пользователи могут создавать и изменять статьи, которые хранятся на сервере. Мне было интересно, как лучше всего обрабатывать измененное состояние статьи перед ее сохранением на сервере. Я могу придумать несколько разных способов решить эту проблему:
1) Неконтролируемые входы
Я могу заполнить элементы ввода с помощью defaultValue
и нигде не сохранять состояние в явном виде. DOM будет использоваться в качестве моего хранилища для измененных данных. Когда пользователь нажимает "сохранить", я собираю все поля, считываю значения и создаю мутацию.
Pro:
- Нет обработки локальных состояний
Contra:
- Я не могу точно знать, какие поля были изменены, и мне нужно будет отправить все данные с помощью мутации. Или понадобится дополнительная логика для создания различий
- Невозможно обновить другие части представления в ответ на изменения состояния
2) Копировать в локальном штате:
Я мог бы хранить измененную статью в локальном состоянии компонента React и использовать контролируемые поля ввода для ее синхронизации.
Pro:
- Локальное состояние могло изменить только поля, так что diff будет легко
- Другие части пользовательского интерфейса могут реагировать на изменения локального состояния
Contra:
- Это кажется своего рода анти-паттерном, потому что данные в представлении не поступают напрямую из реле. Синхронизация между локальным состоянием и ретранслятором может стать источником ошибок
3) Сервер новый локальный:
Просто создайте мутацию для каждого внесенного изменения. Использование оптимистичных обновлений также должно обеспечить хороший UX.
Pro:
- Реле - единственный источник правды для данных
- Состояние сохраняется на стороне сервера, поэтому создается резервная копия, если пользователь случайно закрывает браузер
Contra:
- Для этого потребуется более сложная реализация на стороне сервера для обработки случаев, когда пользователь хочет отказаться от черновика и т.д.
- Многие мутации вызвали
Вот три способа решения этой проблемы, о которых я мог подумать, но, возможно, есть и лучшие способы решения этой проблемы.
Я видел, что идет много дискуссий о том, как обрабатывать локальное состояние с помощью Relay, и может появиться встроенное решение с будущей версией Relay, но мне нужно решение, которое работает с текущей версией реле.