Реагируйте на собственные данные для отправки формы с помощью навигации и управления экранами

Question

Какова лучшая практика для работы с формами, где я хотел бы, чтобы несколько (одинаковых) форм были "сохранены" (может быть, в формате JSON где-нибудь) перед тем, как сохранить их в базе данных или что-то с ними сделать.

Идея состоит в том, что у пользователя будет несколько изображений, а затем у каждого изображения будет свой экран с полями ввода текста, чтобы применить информацию, которую он может сохранить, для описания изображения. Затем пользователь нажимает «Далее», и на экране будет скользить рядом с пустыми формами и следующее изображение. Это будет продолжаться до конца массива изображений, после чего пользователь «завершит» всю информацию.

Я предполагаю, что я буду использовать 1 компонент, потому что формат будет таким же, но как мне получить это будет тот же компонент с пустыми формами и где вся информация где-то хранится?

edit: это также понадобится для работы с видео компонентами.

Answer 1

Я думаю, что вы спрашиваете о viewPager: пример библиотеки: act-native-viewpager

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

(Поскольку расположение каждого подкомпонента одинаковое, вы, конечно, можете повторно использовать его внутри view-пейджера).

Answer 2

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

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

Затем все входные данные, введенные пользователем в форме экран, вы можете передать его на следующий экран через params маршрута. Наконец, когда вы дойдете до экрана lats, просто извлеките все собранные данные из параметров и поместите их в базу данных.

Это не обеспечивает какого-либо локального сохранения, если пользователь закрывает приложение в середина последовательности экрана.

Если вам нужна рекомендованная библиотека для сбора изображений и видео от пользователя, то здесь response-native-image-crop-picker

Cheers !

Answer 3

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

https://github.com/archriss/react-native-snap-carousel/issues/102

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