{"id":316324,"date":"2021-01-13T15:01:34","date_gmt":"2021-01-13T15:01:34","guid":{"rendered":"http:\/\/savepearlharbor.com\/?p=316324"},"modified":"-0001-11-30T00:00:00","modified_gmt":"-0001-11-29T21:00:00","slug":"","status":"publish","type":"post","link":"https:\/\/savepearlharbor.com\/?p=316324","title":{"rendered":"\u041f\u0430\u043a\u0435\u0442 \u0432\u0430\u043b\u0438\u0434\u0430\u0446\u0438\u0438 mobx form validation kit 2.0 (TypeScript \/ Flutter)"},"content":{"rendered":"\n
\n

\u041f\u0440\u0435\u0434\u0438\u0441\u043b\u043e\u0432\u0438\u0435<\/h2>\n

\u041f\u043e\u0447\u0442\u0438 \u043f\u043e\u043b\u0442\u043e\u0440\u0430 \u0433\u043e\u0434\u0430 \u043d\u0430\u0437\u0430\u0434 \u043c\u044b \u0432\u044b\u043f\u0443\u0441\u0442\u0438\u043b\u0438 \u043f\u0435\u0440\u0432\u0443\u044e \u0432\u0435\u0440\u0441\u0438\u044e \u0431\u0438\u0431\u043b\u0438\u043e\u0442\u0435\u043a\u0438 "\u041d\u043e\u0432\u044b\u0439 \u043f\u0430\u043a\u0435\u0442 \u0432\u0430\u043b\u0438\u0434\u0430\u0446\u0438\u0439 \u0434\u043b\u044f React \u043d\u0430 Mobx @quantumart\/mobx-form-validation-kit<\/a>"
\u0412\u0440\u0435\u043c\u044f \u0448\u043b\u043e, \u0438 \u0431\u0438\u0431\u043b\u0438\u043e\u0442\u0435\u043a\u0430 \u043a\u043e\u0440\u0440\u0435\u043a\u0442\u0438\u0440\u043e\u0432\u0430\u043b\u0430\u0441\u044c \u0438 \u043d\u0435 \u0441\u0442\u043e\u044f\u043b\u0430 \u043d\u0430 \u043c\u0435\u0441\u0442\u0435, \u0434\u0430 \u0441\u043e\u0431\u0441\u0442\u0432\u0435\u043d\u043d\u043e, \u043a\u0430\u043a \u0438 \u043d\u0430\u0448\u0435 \u0440\u0430\u0437\u0432\u0438\u0442\u0438\u0435 \u0432 \u0446\u0435\u043b\u043e\u043c. \u041c\u044b \u043f\u0435\u0440\u0435\u0448\u043b\u0438 \u043d\u0430 flutter, \u043f\u043e \u043f\u0443\u0442\u0438 \u043f\u043e\u043f\u0438\u043d\u0430\u0432 ReactNative, \u0441\u0434\u0435\u043b\u0430\u043b\u0438 \u0435\u0449\u0435 \u043d\u0435\u0441\u043a\u043e\u043b\u044c\u043a\u043e \u043f\u0440\u043e\u0435\u043a\u0442\u043e\u0432. \u0418 \u043d\u043e\u0432\u044b\u0435 \u0437\u0430\u0434\u0430\u0447\u0438 \u043f\u043e\u0442\u0440\u0435\u0431\u043e\u0432\u0430\u043b\u0438 \u043e\u0442 \u043d\u0430\u0441 \u043d\u043e\u0432\u044b\u0445 \u0438 \u0441\u043e\u0432\u0440\u0435\u043c\u0435\u043d\u043d\u044b\u0445 \u0440\u0435\u0448\u0435\u043d\u0438\u0439, \u0432 \u0442\u043e\u043c \u0447\u0438\u0441\u043b\u0435 \u0438 \u043f\u0435\u0440\u0435\u0440\u0430\u0431\u043e\u0442\u043a\u0438 mobx-form-validation-kit.
\u0421\u0435\u0433\u043e\u0434\u043d\u044f \u044f \u0440\u0430\u0434 \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u0438\u0442\u044c \u0432\u0430\u043c \u043d\u043e\u0432\u0443\u044e \u0432\u0435\u0440\u0441\u0438\u044e \u043f\u0430\u043a\u0435\u0442\u0430 mobx-form-validation-kit.
\u0414\u043b\u044f \u0441\u0442\u0440\u043e\u0433\u043e \u0442\u0438\u043f\u0438\u0437\u0438\u0440\u043e\u0432\u0430\u043d\u043d\u043e\u0433\u043e TypeScript
mobx-form-validation-kit 2.0<\/a>
\u0418 \u043f\u0435\u0440\u0435\u043f\u0438\u0441\u0430\u043d\u043d\u044b\u0439 \u0432\u0430\u0440\u0438\u0430\u043d\u0442 \u0431\u0438\u0431\u043b\u0438\u043e\u0442\u0435\u043a\u0438 \u043f\u043e\u0434 Flutter
 flutter_mobx_form_validation_kit 2.0<\/a><\/p>\n


<\/a><\/p>\n

\u0414\u0430\u043b\u0435\u0435 \u0441\u0442\u0430\u0442\u044c\u044f \u0431\u0443\u0434\u0435\u0442 \u0440\u0430\u0437\u0434\u0435\u043b\u0435\u043d\u0430 \u043d\u0430 \u043f\u0440\u0438\u043c\u0435\u0440\u044b \u0434\u043b\u044f TypeScript \u0438 Flutter, \u0447\u0438\u0442\u0430\u0442\u044c \u0432\u043f\u043e\u043b\u043d\u0435 \u043c\u043e\u0436\u043d\u043e \u0442\u043e\u043b\u044c\u043a\u043e \u043e\u0434\u043d\u0443 \u0432\u0435\u0440\u0441\u0438\u044e [\u043f\u0440\u0438\u043c\u0435\u0440\u044b \u043a\u043e\u0434\u0430], \u0430 \u044d\u043d\u0442\u0443\u0437\u0438\u0430\u0441\u0442\u044b \u043e\u0431\u043e\u0438\u0445 \u044f\u0437\u044b\u043a\u043e\u0432 \u0441\u043c\u043e\u0433\u0443\u0442 \u0441\u0440\u0430\u0432\u043d\u0438\u0442\u044c \u043f\u043e\u0434\u0445\u043e\u0434\u044b \u0438 \u043f\u0440\u0438\u043c\u0435\u043d\u044f\u0442\u044c \u0435\u0434\u0438\u043d\u044b\u0439 \u043f\u043e\u0434\u0445\u043e\u0434 \u043a \u0432\u0430\u043b\u0438\u0434\u0430\u0446\u0438\u0438 \u0432\u0435\u0437\u0434\u0435.<\/p>\n

Get Started.<\/h2>\n

\u0411\u0438\u0431\u043b\u0438\u043e\u0442\u0435\u043a\u0443 \u043c\u043e\u0436\u043d\u043e \u043f\u0440\u0438\u043c\u0435\u043d\u044f\u0442\u044c \u043f\u0440\u0438 \u0440\u0430\u0437\u043d\u044b\u0445 \u043f\u043e\u0434\u0445\u043e\u0434\u0430\u0445 \u043a \u0441\u0442\u0440\u0443\u043a\u0442\u0443\u0440\u0435 \u043a\u043e\u0434\u0430, \u043d\u043e \u044f \u0431\u0443\u0434\u0443 \u0440\u0430\u0441\u0441\u043c\u0430\u0442\u0440\u0438\u0432\u0430\u0442\u044c \u0431\u0438\u0431\u043b\u0438\u043e\u0442\u0435\u043a\u0443 \u0432 \u043a\u043e\u043d\u0446\u0435\u043f\u0446\u0438\u0438 MVC (Model-View-Controller). <\/p>\n

\n

TypeScript<\/b>
\u0422.\u0435. \u043e\u0442\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u0435 \u043f\u0440\u043e\u0438\u0441\u0445\u043e\u0434\u0438\u0442 \u0447\u0435\u0440\u0435\u0437 \u00ab\u0433\u043b\u0443\u043f\u044b\u0435\u00bb \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u044b, \u0430 \u0431\u0438\u0437\u043d\u0435\u0441 \u043b\u043e\u0433\u0438\u043a\u0430 (\u0432 \u0442\u043e\u043c \u0447\u0438\u0441\u043b\u0435 \u0438 \u0432\u0430\u043b\u0438\u0434\u0430\u0446\u0438\u044f) \u0437\u0430\u0448\u0438\u0442\u0430 \u0432 Store-\u0430\u0445.
\u041a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u044b \u0431\u0443\u0434\u0443\u0442 \u0441\u0442\u0440\u043e\u0438\u0442\u044c\u0441\u044f \u043d\u0430 react-\u0445\u0443\u043a\u0430\u0445, \u043f\u0440\u043e\u0441\u0442\u043e \u043f\u043e \u043f\u0440\u0438\u0447\u0438\u043d\u0435, \u0447\u0442\u043e \u043e\u043d \u0431\u043e\u043b\u0435\u0435 \u0441\u043e\u0432\u0440\u0435\u043c\u0435\u043d\u043d\u044b\u0439, \u043d\u043e \u0431\u0438\u0431\u043b\u0438\u043e\u0442\u0435\u043a\u0430 \u0445\u043e\u0440\u043e\u0448\u043e \u0440\u0430\u0431\u043e\u0442\u0430\u0435\u0442 \u0438 \u043f\u0440\u0438 \u00ab\u043a\u043b\u0430\u0441\u0441\u043e\u0432\u043e\u043c \u043f\u043e\u0434\u0445\u043e\u0434\u0435\u00bb. <\/p>\n

\n

Flutter<\/b>
\u041d\u0435\u0441\u043c\u043e\u0442\u0440\u044f \u043d\u0430 \u0442\u043e, \u0447\u0442\u043e MVC \u043f\u043e\u0434\u0445\u043e\u0434 \u0444\u0430\u043a\u0442\u0438\u0447\u0435\u0441\u043a\u0438 \u043e\u0437\u043d\u0430\u0447\u0430\u0435\u0442, \u0447\u0442\u043e widget-\u044b \u043c\u044b \u0434\u043e\u043b\u0436\u043d\u044b \u0443\u043d\u0430\u0441\u043b\u0435\u0434\u043e\u0432\u0430\u0442\u044c \u043e\u0442 StatelessWidget \u043a\u043b\u0430\u0441\u0441\u0430, \u043d\u0430\u0448\u0438 widget-\u044b \u0431\u0443\u0434\u0443\u0442 \u043d\u0430\u0441\u043b\u0435\u0434\u043d\u0438\u043a\u0430\u043c\u0438 StatefulWidget. \u042d\u0442\u043e \u0434\u043e\u043f\u0443\u0449\u0435\u043d\u0438\u0435 \u0438\u0441\u0445\u043e\u0434\u0438\u0442 \u0442\u043e\u043b\u044c\u043a\u043e \u0438\u0437 \u0440\u0435\u043a\u043e\u043c\u0435\u043d\u0434\u0430\u0446\u0438\u0439 \u043f\u0430\u043a\u0435\u0442\u0430 flutter_mobx<\/a> \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u0441\u043b\u0443\u0436\u0438\u0442 \u0434\u043b\u044f \u0432\u0438\u0437\u0443\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u0438 \u0438\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u0439 \u0432 widget-\u0430\u0445 \u043f\u0440\u0438 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u0438 state management-\u0430 mobx. \u041d\u043e \u043e\u043f\u044f\u0442\u044c \u0436\u0435, \u0432 \u043d\u0430\u0448\u0438\u0445 StatefulWidget-\u0430\u0445 \u0444\u0430\u043a\u0442\u0438\u0447\u0435\u0441\u043a\u0438 \u043d\u0435 \u0431\u0443\u0434\u0435\u0442 \u0431\u0438\u0437\u043d\u0435\u0441 \u043b\u043e\u0433\u0438\u043a\u0438.
^^^^^^^ <\/p>\n

\n

\u0412 \u044d\u0442\u043e\u0442 \u0440\u0430\u0437, \u044f \u0441\u0442\u0430\u0442\u044c\u044e \u043d\u0430\u0447\u043d\u0443 \u0438\u043c\u0435\u043d\u043d\u043e \u0441 \u0441\u043e\u0432\u0441\u0435\u043c \u0431\u0430\u0437\u043e\u0432\u044b\u0445 \u043f\u0440\u0438\u043c\u0435\u0440\u043e\u0432. \u0410 \u0444\u0430\u043a\u0442\u0438\u0447\u0435\u0441\u043a\u0438 \u0441 \u0441\u043e\u0437\u0434\u0430\u043d\u0438\u044f \u043f\u0440\u043e\u0435\u043a\u0442\u0430. <\/p>\n

\n

TypeScript<\/b>
\u0421\u043e\u0437\u0434\u0430\u0435\u043c \u0431\u0430\u0437\u043e\u0432\u044b\u0439 \u043f\u0440\u043e\u0435\u043a\u0442
npx create-react-app my-app —template typescript<\/i><\/p>\n

\u041f\u043e\u0434\u043a\u043b\u044e\u0447\u0430\u0435\u043c mobx
mobx: "^5.15.7",
mobx-react-lite: "^2.2.2",
\u0422\u0443\u0442 \u043d\u0443\u0436\u043d\u043e \u0441\u0434\u0435\u043b\u0430\u0442\u044c \u0440\u0435\u043c\u0430\u0440\u043a\u0443, \u0447\u0442\u043e \u0432 \u043d\u043e\u0432\u043e\u0439 6-\u0439 \u0432\u0435\u0440\u0441\u0438\u0438 mobx, \u0440\u0435\u0431\u044f\u0442\u0430 \u0443\u0448\u043b\u0438 \u043e\u0442 \u0434\u0435\u043a\u0430\u0440\u0430\u0442\u043e\u0440\u043e\u0432\u2026 \u041a\u0430\u043a \u0441\u043b\u0435\u0434\u0441\u0442\u0432\u0438\u0435 \u043d\u0430 6-\u0439 \u0432\u0435\u0440\u0441\u0438\u0438 \u00abmobx-form-validation-kit\u00bb \u043f\u043e\u043a\u0430 \u043d\u0435\u0434\u043e\u0441\u0442\u0443\u043f\u043d\u0430. \u042f \u0434\u0443\u043c\u0430\u044e \u0432 \u0431\u043b\u0438\u0436\u0430\u0439\u0448\u0435\u0435 \u0432\u0440\u0435\u043c\u044f \u043f\u043e\u0441\u043b\u0435 \u043f\u0443\u0431\u043b\u0438\u043a\u0430\u0446\u0438\u0438 \u0441\u0442\u0430\u0442\u044c\u0438 \u043c\u044b \u0441\u0434\u0435\u043b\u0430\u0435\u043c \u0432\u0435\u0440\u0441\u0438\u044e \u00abmobx-form-validation-kit 3.0\u00bb \u0434\u043b\u044f \u043f\u043e\u0434\u0434\u0435\u0440\u0436\u043a\u0438 mobx 6+. \u041d\u043e API \u0432\u0437\u0430\u0438\u043c\u043e\u0434\u0435\u0439\u0441\u0442\u0432\u0438\u044f \u043c\u0435\u043d\u044f\u0442\u044c \u043d\u0435 \u0431\u0443\u0434\u0435\u043c, \u0442\u043e \u044d\u0442\u0430 \u0441\u0442\u0430\u0442\u044c\u044f \u0431\u0443\u0434\u0435\u0442 \u0430\u043a\u0442\u0443\u0430\u043b\u044c\u043d\u0430.
\u0421\u043e\u0431\u0441\u0442\u0432\u0435\u043d\u043d\u043e \u043f\u043e\u0434\u043a\u043b\u044e\u0447\u0430\u0435\u043c \u0431\u0438\u0431\u043b\u0438\u043e\u0442\u0435\u043a\u0443 mobx-form-validation-kit
npm install @quantumart\/mobx-form-validation-kit<\/i><\/p>\n

\u0412 \u0444\u0430\u0439\u043b tsconfig.json \u0435\u0449\u0435 \u043f\u0440\u043e\u043f\u0438\u0441\u044b\u0432\u0430\u0435\u043c.
\u00abexperimentalDecorators\u00bb: true, <\/p>\n

\n

Flutter<\/b>
\u0421\u043e\u0437\u0434\u0430\u0435\u043c \u0431\u0430\u0437\u043e\u0432\u044b\u0439 \u043f\u0440\u043e\u0435\u043a\u0442
flutter create myapp<\/i><\/p>\n

\u0412 \u0437\u0430\u0432\u0438\u0441\u0438\u043c\u043e\u0441\u0442\u044f\u0445 (pubspec.yaml) \u043f\u0440\u043e\u043f\u0438\u0448\u0435\u043c \u0441\u043b\u0435\u0434\u0443\u044e\u0449\u0435\u0435.
dependencies:
flutter:
sdk: flutter
flutter_mobx: ^1.1.0+2
flutter_mobx_form_validation_kit:: ^2.0.0<\/i><\/p>\n

dev_dependencies:
flutter_test:
sdk: flutter
build_runner: ^1.10.11
mobx_codegen: ^1.1.2<\/i>
^^^^^^^ <\/p>\n

\n

\u0412 \u0446\u0435\u043b\u043e\u043c, \u044f \u0431\u044b \u043d\u0435 \u0445\u043e\u0442\u0435\u043b \u043f\u043e\u0434\u0440\u043e\u0431\u043d\u043e \u043e\u0441\u0442\u0430\u043d\u0430\u0432\u043b\u0438\u0432\u0430\u0442\u044c\u0441\u044f \u043d\u0430 \u0442\u043e\u043c \u043a\u0430\u043a \u0440\u0430\u0431\u043e\u0442\u0430\u0435\u0442 mobx \u0438\u043b\u0438 \u043e\u043f\u0438\u0441\u044b\u0432\u0430\u0442\u044c \u043a\u0430\u043a \u043f\u0440\u0430\u0432\u0438\u043b\u044c\u043d\u043e \u043e\u0440\u0433\u0430\u043d\u0438\u0437\u043e\u0432\u0430\u0442\u044c \u0441\u0442\u0440\u0443\u043a\u0442\u0443\u0440\u0443 \u043f\u0430\u043f\u043e\u043a. \u0418\u0431\u043e \u044d\u0442\u043e \u0442\u0435\u043c\u0430 \u0434\u043b\u044f \u043e\u0442\u0434\u0435\u043b\u044c\u043d\u043e\u0439 \u0431\u043e\u043b\u044c\u0448\u043e\u0439 \u0441\u0442\u0430\u0442\u044c\u0438. \u042f \u0438\u0441\u0445\u043e\u0436\u0443 \u0438\u0437 \u043f\u0440\u0435\u0434\u043f\u043e\u043b\u043e\u0436\u0435\u043d\u0438\u044f, \u0447\u0442\u043e, \u0440\u0430\u0437 \u0432\u044b \u0447\u0438\u0442\u0430\u0435\u0442\u0435 \u044d\u0442\u0443 \u0441\u0442\u0430\u0442\u044c\u044e, \u0442\u043e \u0443\u0436\u0435 \u0441\u0442\u0430\u043b\u043a\u0438\u0432\u0430\u043b\u0438c\u044c \u0441 mobx \u0438 \u043f\u043e\u043d\u0438\u043c\u0430\u0435\u0442\u0435, \u043e \u0447\u0435\u043c \u0438\u0434\u0435\u0442 \u0440\u0435\u0447\u044c \u0438 \u043a\u0430\u043a\u0438\u0435 \u0435\u0441\u0442\u044c \u043f\u0440\u043e\u0431\u043b\u0435\u043c\u044b \u043d\u0430 \u0444\u043e\u0440\u043c\u0430\u0445 \u0432\u0432\u043e\u0434\u0430.
\u0414\u0435\u043b\u0430\u0442\u044c \u043c\u044b \u0431\u0443\u0434\u0435\u043c \u043d\u0435\u0431\u043e\u043b\u044c\u0448\u0443\u044e \u0444\u043e\u0440\u043c\u0443 \u0440\u0435\u0433\u0438\u0441\u0442\u0440\u0430\u0446\u0438\u0438. <\/p>\n

\n

TypeScript<\/b>
App \u043f\u0435\u0440\u0435\u0434\u0435\u043b\u0430\u0435\u043c \u043d\u0430 \u0442\u0430\u043a\u043e\u0439 \u0432\u0430\u0440\u0438\u0430\u043d\u0442 <\/p>\n

function App() {   return (     <RegistrationComponent \/>   ); } <\/code><\/pre>\n
  \u0421\u043e\u0437\u0434\u0430\u0434\u0438\u043c \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442 \u0438 Store\u2026 \u041f\u043e\u043a\u0430 \u043f\u043e\u043b\u0443\u0447\u0438\u043c \u0432\u043e\u0442 \u0442\u0430\u043a\u0438\u0445 \u0434\u0432\u0430 \u0431\u0430\u0437\u043e\u0432\u044b\u0445 \u0444\u0430\u0439\u043b\u0438\u043a\u0430.
    <\/p>\n
\n
  Flutter<\/b>
  Main \u043f\u0435\u0440\u0435\u0434\u0435\u043b\u0430\u0435\u043c \u043d\u0430 \u0442\u0430\u043a\u043e\u0439 \u0432\u0430\u0440\u0438\u0430\u043d\u0442  <\/p>\n
class MyApp extends StatelessWidget {   \/\/ This widget is the root of your application.   @override   Widget build(BuildContext context) {     return MaterialApp(       title: 'Flutter Demo',       theme: ThemeData(         primarySwatch: Colors.blue,         visualDensity: VisualDensity.adaptivePlatformDensity,       ),       home: Scaffold(body: SafeArea(child: Registration())),     );   } } <\/code><\/pre>\n
  \u0421\u043e\u0437\u0434\u0430\u0434\u0438\u043c \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442 \u0438 Store\u2026 \u041f\u043e\u043a\u0430 \u043f\u043e\u043b\u0443\u0447\u0438\u043c \u0432\u043e\u0442 \u0442\u0430\u043a\u0438\u0445 \u0434\u0432\u0430 \u0431\u0430\u0437\u043e\u0432\u044b\u0445 \u0444\u0430\u0439\u043b\u0438\u043a\u0430.
  
  ^^^^^^^  <\/p>\n
\n
  \u0417\u0430\u043a\u043e\u043d\u0447\u0438\u0432 \u043f\u0440\u0438\u0433\u043e\u0442\u043e\u0432\u043b\u0435\u043d\u0438\u044f, \u0443 \u043d\u0430\u0441 \u0443\u0436\u0435 \u043f\u043e\u043b\u0443\u0447\u0438\u0442\u0441\u044f \u0440\u0430\u0431\u043e\u0447\u0430\u044f \u0444\u043e\u0440\u043c\u043e\u0447\u043a\u0430\/\u0441\u0442\u0440\u0430\u043d\u0438\u0447\u043a\u0430 \u043d\u0430 \u043a\u043e\u0442\u043e\u0440\u043e\u0439 \u043f\u0440\u0438 \u0432\u0432\u043e\u0434\u0435 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u044f \u0432 \u043f\u043e\u043b\u0435 \u0432\u0432\u043e\u0434\u0430 (input \/ TextField) \u0441\u0432\u0435\u0440\u0445\u0443 \u0431\u0443\u0434\u0435\u0442 \u043e\u0442\u043e\u0431\u0440\u0430\u0436\u0430\u0442\u044c\u0441\u044f \u0432\u0432\u0435\u0434\u0435\u043d\u043d\u043e\u0435 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435.
  \u041d\u0430\u0447\u043d\u0435\u043c \u0441 \u043f\u0440\u043e\u0441\u0442\u043e\u0433\u043e. 
  \u041c\u044b \u0437\u0430\u043f\u0440\u0435\u0442\u0438\u043c \u043e\u0441\u0442\u0430\u0432\u043b\u044f\u0442\u044c \u0418\u043c\u044f \u043f\u0443\u0441\u0442\u044b\u043c.  <\/p>\n
\n
  TypeScript<\/b>
  \u0418\u0437\u043c\u0435\u043d\u0438\u043c \u0443\u043d\u0430\u0441\u043b\u0435\u0434\u043e\u0432\u0430\u043d\u043d\u044b\u0439 \u0438\u043d\u0442\u0435\u0440\u0444\u0435\u0439\u0441 FormRegistration \u043e\u0442 ControlsCollection. \u041f\u043e \u0444\u0430\u043a\u0442\u0443 \u0437\u0434\u0435\u0441\u044c \u0431\u0443\u0434\u0435\u0442 \u0445\u0440\u0430\u043d\u0438\u0442\u0441\u044f \u0442\u043e\u043b\u044c\u043a\u043e \u043d\u0430\u0431\u043e\u0440 \u043f\u043e\u043b\u0435\u0439, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u043c\u044b \u0445\u043e\u0442\u0438\u043c \u043e\u0442\u043e\u0431\u0440\u0430\u0436\u0430\u0442\u044c \/ \u0432\u0430\u043b\u0438\u0434\u0438\u0440\u043e\u0432\u0430\u0442\u044c.  <\/p>\n
interface FormRegistration extends ControlsCollection {   name: FormControl<string>; }<\/code><\/pre>\n
  \u0421\u0430\u043c Store \u043f\u0435\u0440\u0435\u0441\u0442\u0430\u0435\u0442 \u0445\u0440\u0430\u043d\u0438\u0442\u044c observable \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u044b. \u041d\u0430 \u0434\u0430\u043d\u043d\u044b\u0439 \u043c\u043e\u043c\u0435\u043d\u0442 \u043e\u043d\u0438 \u043d\u0430\u043c \u043d\u0435 \u043d\u0443\u0436\u043d\u044b. \u0412\u0441\u044f \u00ab\u043c\u0430\u0433\u0438\u044f\u00bb \u0432\u043d\u0443\u0442\u0440\u0438 \u0431\u0438\u0431\u043b\u0438\u043e\u0442\u0435\u043a\u0438.  <\/p>\n
export class RegistrationStore {   public form: FormGroup<FormRegistration>;    constructor() {     this.form = new FormGroup<FormRegistration>({       name: new FormControl<string>("", {         validators: [requiredValidator()],       }),     });   } }<\/code><\/pre>\n
  \u041d\u0430\u0448 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442, \u0434\u043b\u044f \u043e\u0442\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u044f, \u0431\u0443\u0434\u0435\u0442 \u0432\u044b\u0433\u043b\u044f\u0434\u0435\u0442\u044c \u0442\u0430\u043a:  <\/p>\n
const store = new RegistrationStore(); export function RegistrationComponent() {   return useObserver(() => (     <div>       <p>{store.form.controls.name.value}<\/p>       <input         type="text"         value={store.form.controls.name.value}         onChange={(event: React.ChangeEvent<HTMLInputElement>) => {           store.form.controls.name.value = event.target.value;         }}       \/>     <\/div>   )); }<\/code><\/pre>\n
  \u0417\u0434\u0435\u0441\u044c \u0444\u0430\u043a\u0442\u0438\u0447\u0435\u0441\u043a\u0438 \u043d\u0438\u0447\u0435\u0433\u043e \u043d\u0435 \u043c\u0435\u043d\u044f\u0435\u0442\u0441\u044f. \u041b\u0438\u0448\u044c \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u044f \u0447\u0438\u0442\u0430\u044e\u0442\u0441\u044f \u0438\u0437 store.form.controls.name.value.
  \u0412 \u0446\u0435\u043b\u043e\u043c \u044d\u0442\u043e\u0433\u043e \u0434\u043e\u0441\u0442\u0430\u0442\u043e\u0447\u043d\u043e, \u0447\u0442\u043e \u0431\u044b \u0432\u0430\u043b\u0438\u0434\u0430\u0446\u0438\u0438 \u0432 FormControl \u0440\u0430\u0431\u043e\u0442\u0430\u043b\u0438.
  \u0414\u0430\u0432\u0430\u0439\u0442\u0435 \u0432\u044b\u0432\u0435\u0434\u0435\u043c \u043e\u0448\u0438\u0431\u043a\u0438 \u0441\u0442\u0440\u043e\u043a\u043e\u0439 \u043d\u0438\u0436\u0435 \u0441\u043e\u0437\u0434\u0430\u043d\u043d\u043e\u0433\u043e \u043d\u0430\u043c\u0438 \u043f\u043e\u043b\u044f \u0432\u0432\u043e\u0434\u0430:  <\/p>\n
 \u2026 {store.form.controls.name.errors.map((error) => (         <p style={{ color: "#FFF" }}>{error.message}<\/p>       ))} \u2026 <\/code><\/pre>\n
  <\/p>\n
\n
  Flutter<\/b>
  \u0414\u043b\u044f \u043d\u0430\u0447\u0430\u043b\u0430 \u043d\u0430\u043c \u043d\u0443\u0436\u043d\u043e \u0441\u043e\u0437\u0434\u0430\u0442\u044c \u043a\u043b\u0430\u0441\u0441 \u0443\u043d\u0430\u0441\u043b\u0435\u0434\u043e\u0432\u0430\u043d\u043d\u044b\u0439 \u043e\u0442 ControlsCollection. \u041f\u043e \u0444\u0430\u043a\u0442\u0443 \u0437\u0434\u0435\u0441\u044c \u0431\u0443\u0434\u0435\u0442 \u0445\u0440\u0430\u043d\u0438\u0442\u044c\u0441\u044f \u0442\u043e\u043b\u044c\u043a\u043e \u043d\u0430\u0431\u043e\u0440 \u043f\u043e\u043b\u0435\u0439, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u043c\u044b \u0438 \u0445\u043e\u0442\u0438\u043c \u043e\u0442\u043e\u0431\u0440\u0430\u0437\u0438\u0442\u044c \/ \u0432\u0430\u043b\u0438\u0434\u0438\u0440\u043e\u0432\u0430\u0442\u044c.  <\/p>\n
class RegistrationForm extends ControlsCollection {   final FormControl<String> name;   RegistrationForm({this.name});   @override   Iterable<AbstractControl> allFields() => [this.name]; }<\/code><\/pre>\n
  \u041e\u0441\u043d\u043e\u0432\u043d\u043e\u0435 \u043e\u0433\u0440\u0430\u043d\u0438\u0447\u0435\u043d\u0438\u0435 Flutter \u044d\u0442\u043e \u043e\u0442\u0441\u0443\u0442\u0441\u0442\u0432\u0438\u0435 reflection \u0438\u043b\u0438 mirror. \u041a\u0430\u043a \u0441\u043b\u0435\u0434\u0441\u0442\u0432\u0438\u0435 \u043d\u0430\u043c \u043d\u0443\u0436\u043d\u043e \u0431\u0443\u0434\u0435\u0442 override-\u0434\u0438\u0442\u044c \u043c\u0435\u0442\u043e\u0434 allFields \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u0432\u0435\u0440\u043d\u0435\u0442 \u0432\u0435\u0441\u044c \u043d\u0430\u0431\u043e\u0440 \u043f\u043e\u043b\u0435\u0439 \u0432 \u043a\u043b\u0430\u0441\u0441\u0435.<\/p>\n
  \u0414\u043b\u044f \u0441\u0430\u043c\u043e\u0433\u043e store \u0438\u0437\u043c\u0435\u043d\u0438\u0442\u0441\u044f \u0442\u0430\u043a. \u041a\u0430\u043a \u0432\u0438\u0434\u0438\u0442\u0435, \u0432 \u0434\u0430\u043d\u043d\u044b\u0439 \u043c\u043e\u043c\u0435\u043d\u0442 \u0434\u0430\u0436\u0435 mobx \u043e\u0431\u0435\u0440\u0442\u043a\u0430 \u0434\u043b\u044f store \u043d\u0435 \u043d\u0443\u0436\u043d\u0430. \u0412\u0441\u044f \u00ab\u043c\u0430\u0433\u0438\u044f\u00bb \u0432\u043d\u0443\u0442\u0440\u0438 \u0431\u0438\u0431\u043b\u0438\u043e\u0442\u0435\u043a\u0438.  <\/p>\n
class RegistrationStore {   FormGroup<RegistrationForm> form;    RegistrationStore() {     this.form = FormGroup(RegistrationForm(         name: FormControl(             value: "",             options: OptionsFormControl(validators: [requiredValidator()]))));   }    void dispose() {     this.form.dispose();   } }<\/code><\/pre>\n
  \u0421\u0430\u043c \u0436\u0435 \u0432\u0438\u0434\u0436\u0435\u0442 \u0431\u0443\u0434\u0435\u0442 \u0432\u044b\u0433\u043b\u044f\u0434\u0435\u0442\u044c \u0442\u0430\u043a.  <\/p>\n
class _RegistrationState extends State<Registration> {   RegistrationStore store = RegistrationStore();    @override   void dispose() {     store.dispose();     super.dispose();   }    @override   Widget build(_) => Observer(builder: (BuildContext context) {         return Column(             crossAxisAlignment: CrossAxisAlignment.start,             mainAxisAlignment: MainAxisAlignment.center,             children: [               Text(store.form.controls.name.value,                   style: TextStyle(fontSize: 20)),               TextField(                 controller: store.form.controls.name.controller,                 onChanged: (String text) =>                     store.form.controls.name.value = text,                 decoration: InputDecoration(                   border: OutlineInputBorder(),                   labelText: "\u0418\u043c\u044f",                 ),               ),             ]);       }); } <\/code><\/pre>\n
  \u041e\u0434\u043d\u0438\u043c \u0438\u0437 \u043e\u0441\u043d\u043e\u0432\u043d\u044b\u0445 \u0438\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u0439 \u044f\u0432\u043b\u044f\u0435\u0442\u0441\u044f \u0434\u043e\u0431\u0430\u0432\u043b\u0435\u043d\u0438\u0435 dispose. \u0412 \u043f\u0440\u043e\u0446\u0435\u0441\u0441\u0435 \u0440\u0430\u0431\u043e\u0442\u044b \u0441\u043e\u0437\u0434\u0430\u0435\u0442\u0441\u044f \u043c\u043d\u043e\u0436\u0435\u0441\u0442\u0432\u043e \u043f\u043e\u0434\u043f\u0438\u0441\u043e\u043a \u043d\u0430 \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u044b. \u0418 \u043e\u0442 \u043d\u0438\u0445 \u043d\u0443\u0436\u043d\u043e \u043a\u043e\u043d\u0435\u0447\u043d\u043e \u0438\u0437\u0431\u0430\u0432\u043b\u044f\u0442\u044c\u0441\u044f \u0435\u0441\u043b\u0438 \u0444\u043e\u0440\u043c\u0430 \u043f\u0435\u0440\u0435\u0441\u0442\u0430\u0435\u0442 \u0431\u044b\u0442\u044c \u043d\u0443\u0436\u043d\u043e\u0439.
  \u0421\u0430\u043c\u043e \u0436\u0435 \u043f\u043e\u043b\u0435 \u0432\u0432\u043e\u0434\u0430 TextField \u0441\u0442\u0430\u043b\u043e \u0432\u044b\u0433\u043b\u044f\u0434\u0435\u0442\u044c \u0442\u0430\u043a.
  TextField(
   controller: store.form.controls.name.controller,
   onChanged: (String text) =>
   store.form.controls.name.value = text,
   decoration: InputDecoration(
   border: OutlineInputBorder(),
   labelText: \u00ab\u0418\u043c\u044f\u00bb,
   ),<\/i>
  \u041f\u0440\u043e\u0448\u0443 \u0437\u0430\u043c\u0435\u0442\u0438\u0442\u044c \u043c\u044b \u043d\u0435 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u043c \u043d\u0438 TextFormField, \u043d\u0438 \u043e\u0431\u0435\u0440\u0442\u043e\u0447\u043d\u044b\u0439 Form \u0434\u043b\u044f \u0432\u0438\u0437\u0443\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u0438, \u043d\u0430\u043c \u044d\u0442\u043e \u043d\u0435 \u043d\u0443\u0436\u043d\u043e. \u041c\u044b \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u043c \u0438\u043c\u0435\u043d\u043d\u043e \u0431\u0430\u0437\u043e\u0432\u044b\u0439 TextField.
  TextField-\u0443 \u043c\u044b \u043f\u0440\u043e\u043f\u0438\u0441\u0430\u043b\u0438 \u043e\u0442\u0434\u0435\u043b\u044c\u043d\u044b\u0439 controller:
  controller: store.form.controls.name.controller<\/i>
  \u041a\u043e\u0442\u043e\u0440\u044b\u0439 \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u0435\u0442 \u043f\u0440\u0430\u0432\u0438\u043b\u044c\u043d\u043e \u043e\u0442\u043e\u0431\u0440\u0430\u0436\u0430\u0442\u044c \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435, \u0437\u0430\u0434\u0430\u043d\u043d\u043e\u0435 \u0432 Store.
  \u0418 \u043a\u043e\u043d\u0435\u0447\u043d\u043e \u0438\u0437\u043c\u0435\u043d\u0438\u043b\u0430\u0441\u044c \u0444\u0443\u043d\u043a\u0446\u0438\u044f onChanged:
  onChanged: (String text) => store.form.controls.name.value = text<\/i>
  \u0412 \u0446\u0435\u043b\u043e\u043c \u044d\u0442\u043e\u0433\u043e \u0434\u043e\u0441\u0442\u0430\u0442\u043e\u0447\u043d\u043e, \u0447\u0442\u043e \u0431\u044b \u0432\u0430\u043b\u0438\u0434\u0430\u0446\u0438\u0438 \u0432 FormControl \u0440\u0430\u0431\u043e\u0442\u0430\u043b\u0438.
  \u0414\u0430\u0432\u0430\u0439\u0442\u0435 \u0432\u044b\u0432\u0435\u0434\u0435\u043c \u043e\u0448\u0438\u0431\u043a\u0438 \u0441\u0442\u0440\u043e\u043a\u043e\u0439 \u043d\u0438\u0436\u0435 \u0441\u043e\u0437\u0434\u0430\u043d\u043d\u043e\u0433\u043e \u043d\u0430\u043c\u0438 \u043f\u043e\u043b\u044f \u0432\u0432\u043e\u0434\u0430:  <\/p>\n
 \u2026 ...store.form.controls.name.errors.map((error) => Text(                   error.message,                   style: TextStyle(color: Colors.red, fontSize: 15))) \u2026 <\/code><\/pre>\n
  ^^^^^^^  <\/p>\n
\n
  \u0418\u0442\u043e\u0433\u043e\u043c \u043c\u044b \u043f\u043e\u043b\u0443\u0447\u0430\u0435\u043c \u0442\u0430\u043a\u0443\u044e \u043a\u0430\u0440\u0442\u0438\u043d\u0443.
  <\/p>\n
  \u0415\u0441\u043b\u0438 \u043d\u0430\u0447\u0430\u0442\u044c \u0447\u0442\u043e-\u0442\u043e \u0432\u0432\u043e\u0434\u0438\u0442\u044c, \u0442\u043e \u043e\u0448\u0438\u0431\u043a\u0430 \u0442\u0443\u0442 \u0436\u0435 \u043f\u0440\u043e\u043f\u0430\u0434\u0435\u0442.
  \u041d\u043e \u0435\u0441\u0442\u0435\u0441\u0442\u0432\u0435\u043d\u043d\u044b\u0439 \u0438 \u043f\u0440\u0438\u0432\u044b\u0447\u043d\u044b\u0439 \u043d\u0430\u043c \u0444\u043e\u0440\u043c\u0430\u0442 \u043e\u0442\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u044f \u043e\u0448\u0438\u0431\u043a\u0438 \u0432\u0430\u043b\u0438\u0434\u0430\u0446\u0438\u0438 \u043f\u043e\u0434\u0440\u0430\u0437\u0443\u043c\u0435\u0432\u0430\u0435\u0442 \u043e\u0442\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u0435 \u044d\u0442\u043e\u0439 \u0441\u0430\u043c\u043e\u0439 \u043e\u0448\u0438\u0431\u043a\u0438 \u043f\u043e\u0441\u043b\u0435 \u0432\u0432\u043e\u0434\u0430 \u0441\u0438\u043c\u0432\u043e\u043b\u0430 \u0438\u043b\u0438 \u043f\u043e\u0441\u043b\u0435 \u0442\u043e\u0433\u043e \u043a\u0430\u043a \u0444\u043e\u043a\u0443\u0441 \u0443 \u043f\u043e\u043b\u044f \u0431\u0443\u0434\u0435\u0442 \u043f\u043e\u0442\u0435\u0440\u044f\u043d. mobx-form-validation-kit \u0438\u043c\u0435\u0435\u0442\u0441\u044f \u0432\u0435\u0441\u044c \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u044b\u0439 \u043d\u0430\u0431\u043e\u0440 \u0434\u043b\u044f \u044d\u0442\u043e\u0433\u043e.
  \u2022 pristine<\/b>: boolean \u2014 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435 \u0432 FormControl, \u043f\u043e\u0441\u043b\u0435 \u0438\u043d\u0438\u0446\u0438\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u0438 \u0434\u0435\u0444\u043e\u043b\u0442\u043d\u044b\u043c \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435\u043c, \u043d\u0435 \u0438\u0437\u043c\u0435\u043d\u044f\u043b\u043e\u0441\u044c.
  \u2022 dirty<\/b>: boolean \u2014 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435 \u0432 FormControl, \u043f\u043e\u0441\u043b\u0435 \u0438\u043d\u0438\u0446\u0438\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u0438 \u0434\u0435\u0444\u043e\u043b\u0442\u043d\u044b\u043c \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435\u043c, \u043c\u0435\u043d\u044f\u043b\u043e\u0441\u044c.
  \u2022 untouched<\/b>: boolean \u2014 \u0434\u043b\u044f FormControl \u2013 \u043e\u0437\u043d\u0430\u0447\u0430\u0435\u0442, \u0447\u0442\u043e \u043f\u043e\u043b\u0435 \u043d\u0435 \u0431\u044b\u043b\u043e \u0432 \u0444\u043e\u043a\u0443\u0441\u0435. \u0414\u043b\u044f FormGroup \u0438 FormArray \u043e\u0437\u043d\u0430\u0447\u0430\u0435\u0442, \u0447\u0442\u043e \u043d\u0438 \u043e\u0434\u0438\u043d \u0438\u0437 \u0432\u043b\u043e\u0436\u0435\u043d\u043d\u044b\u0445 FormControl-\u043e\u0432 \u043d\u0435 \u0431\u044b\u043b \u0432 \u0444\u043e\u043a\u0443\u0441\u0435. \u0417\u043d\u0430\u0447\u0435\u043d\u0438\u0435 false \u0432 \u044d\u0442\u043e\u043c \u043f\u043e\u043b\u0435 \u043e\u0437\u043d\u0430\u0447\u0430\u0435\u0442, \u0447\u0442\u043e \u0444\u043e\u043a\u0443\u0441 \u0431\u044b\u043b \u043d\u0435 \u0442\u043e\u043b\u044c\u043a\u043e \u0431\u044b\u043b \u043f\u043e\u0441\u0442\u0430\u0432\u043b\u0435\u043d, \u043d\u043e \u0438 \u0441\u043d\u044f\u0442 \u0441 \u043f\u043e\u043b\u044f.
  \u2022 touched<\/b>: boolean \u2014 \u0414\u043b\u044f FormControl \u2013 \u043e\u0437\u043d\u0430\u0447\u0430\u0435\u0442, \u0447\u0442\u043e \u043f\u043e\u043b\u0435 \u0431\u044b\u043b\u043e \u0432 \u0444\u043e\u043a\u0443\u0441\u0435. \u0414\u043b\u044f FormGroup \u0438 FormArray \u043e\u0437\u043d\u0430\u0447\u0430\u0435\u0442, \u0447\u0442\u043e \u043e\u0434\u0438\u043d \u0438\u0437 \u0432\u043b\u043e\u0436\u0435\u043d\u043d\u044b\u0445 FormControl-\u043e\u0432 \u0431\u044b\u043b \u0432 \u0444\u043e\u043a\u0443\u0441\u0435. \u0417\u043d\u0430\u0447\u0435\u043d\u0438\u0435 true \u0432 \u044d\u0442\u043e\u043c \u043f\u043e\u043b\u0435 \u043e\u0437\u043d\u0430\u0447\u0430\u0435\u0442, \u0447\u0442\u043e \u0444\u043e\u043a\u0443\u0441 \u0431\u044b\u043b \u043d\u0435 \u0442\u043e\u043b\u044c\u043a\u043e \u0431\u044b\u043b \u043f\u043e\u0441\u0442\u0430\u0432\u043b\u0435\u043d, \u043d\u043e \u0438 \u0441\u043d\u044f\u0442 \u0441 \u043f\u043e\u043b\u044f.
  \u2022 focused<\/b>: boolean \u2014 \u0434\u043b\u044f FormControl \u2013 \u043e\u0437\u043d\u0430\u0447\u0430\u0435\u0442, \u0447\u0442\u043e \u043f\u043e\u043b\u0435 \u0441\u0435\u0439\u0447\u0430\u0441 \u0432 \u0444\u043e\u043a\u0443\u0441\u0435. \u0414\u043b\u044f FormGroup \u0438 FormArray \u043e\u0437\u043d\u0430\u0447\u0430\u0435\u0442, \u0447\u0442\u043e \u043e\u0434\u0438\u043d \u0438\u0437 \u0432\u043b\u043e\u0436\u0435\u043d\u043d\u044b\u0445 FormControl-\u043e\u0432 \u0441\u0435\u0439\u0447\u0430\u0441 \u0432 \u0444\u043e\u043a\u0443\u0441\u0435.
  \u041d\u043e \u0434\u043b\u044f \u043a\u043e\u0440\u0440\u0435\u043a\u0442\u043d\u043e\u0439 \u0440\u0430\u0431\u043e\u0442\u044b \u043d\u0443\u0436\u043d\u043e \u043f\u0435\u0440\u0435\u0434\u0430\u0442\u044c FormControl \u0442\u0435\u043a\u0443\u0449\u0435\u0435 \u0441\u043e\u0441\u0442\u043e\u044f\u043d\u0438\u0435 \u043f\u043e\u043b\u044f.  <\/p>\n
\n
  TypeScript<\/b>  <\/p>\n
 \u2026 <input         type="text"         value={store.form.controls.name.value}         ref={(elment) => (props.control.element = elment)}         onChange={(event: React.ChangeEvent<HTMLInputElement>) => {           store.form.controls.name.value = event.target.value;         }}         onBlur={(event: React.FocusEvent<HTMLInputElement>) => {           store.form.controls.name.setTouched(true);           store.form.controls.name.setFocused(false);         }}         onFocus={(event: React.FocusEvent<HTMLInputElement>) => {           store.form.controls.name.setFocused(true);         }}       \/>       {store.form.controls.name.touched &&         store.form.controls.name.errors.map((error) => (           <p style={{ color: "#F00" }}>{error.message}<\/p>         ))} \u2026 <\/code><\/pre>\n
  \u041a\u0430\u043a \u043c\u044b \u0432\u0438\u0434\u0438\u043c, \u043f\u043e\u044f\u0432\u0438\u043b\u043e\u0441\u044c \u0431\u043e\u043b\u044c\u0448\u043e\u0435 \u043a\u043e\u043b\u0438\u0447\u0435\u0441\u0442\u0432\u043e \u043a\u043e\u0434\u0430, \u0430 \u0438\u043c\u0435\u043d\u043d\u043e \u043c\u0435\u0442\u043e\u0434\u044b
  \u2022 onChange 
  \u2022 onBlur
  \u2022 onFocus
  \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u0438\u043c\u0435\u044e\u0442 \u0432\u043f\u043e\u043b\u043d\u0435 \u0441\u0435\u0431\u0435 \u0441\u0442\u0430\u043d\u0434\u0430\u0440\u0442\u043d\u044b\u0439 \u043f\u043e\u0434\u0445\u043e\u0434. \u0414\u0430\u0431\u044b \u0438\u0445 \u043d\u0435 \u043f\u0438\u0441\u0430\u0442\u044c \u043f\u043e \u0441\u0442\u043e \u0440\u0430\u0437, \u0432 \u043c\u0438\u043d\u0438-\u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f\u0445, \u043c\u043e\u0436\u043d\u043e \u0432\u043e\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c\u0441\u044f \u043d\u0435\u0431\u043e\u043b\u044c\u0448\u043e\u0439 \u043e\u0431\u0435\u0440\u0442\u043a\u043e\u0439, \u0430 \u0438\u043c\u0435\u043d\u043d\u043e InputFormControl \u0438\u043b\u0438 TextAreaFormControl.
  \u0412 \u0442\u0430\u043a\u043e\u043c \u0441\u043b\u0443\u0447\u0430\u0435 \u043a\u043e\u0434 \u0431\u0443\u0434\u0435\u0442 \u0432\u044b\u0433\u043b\u044f\u0434\u0435\u0442\u044c \u0442\u0430\u043a.  <\/p>\n
<input         type="text"         value={store.form.controls.name.value}         {...InputFormControl.bindActions(store.form.controls.name)}       \/><\/code><\/pre>\n
  \u041d\u043e \u043a\u0430\u043a \u043f\u043e\u043a\u0430\u0437\u0430\u043b\u0430 \u043f\u0440\u0430\u043a\u0442\u0438\u043a\u0430 \u043f\u0435\u0440\u0432\u044b\u0439 \u0432\u0430\u0440\u0438\u0430\u043d\u0442 \u0432 \u0431\u043e\u043b\u044c\u0448\u0438\u0445 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f \u043f\u0440\u0435\u0434\u043f\u043e\u0447\u0442\u0438\u0442\u0435\u043b\u044c\u043d\u0435\u0439, \u0438 \u043e\u043d \u0434\u0430\u0435\u0442 \u0431\u043e\u043b\u044c\u0448\u0435 \u043f\u043e\u043d\u0438\u043c\u0430\u043d\u0438\u044f \u043a\u0430\u043a \u0432\u0441\u0451 \u044d\u0442\u043e \u0440\u0430\u0431\u043e\u0442\u0430\u0435\u0442.   <\/p>\n
\n
  Flutter<\/b>
  \u0414\u043b\u044f \u043d\u0430\u0447\u0430\u043b\u0430, \u0442.\u043a. \u043a\u043b\u0438\u043a \u0432 \u043f\u0443\u0441\u0442\u043e\u044e \u0437\u043e\u043d\u0443 \u043d\u0435 \u0441\u0447\u0438\u0442\u0430\u0435\u0442\u0441\u044f \u0432\u043e flutter \u043f\u043e\u0442\u0435\u0440\u0435\u0439 \u0444\u043e\u043a\u0443\u0441\u0430, \u043c\u044b \u043e\u0431\u0435\u0440\u043d\u0435\u043c \u0432\u0435\u0441\u044c \u043d\u0430\u0448 Column \u0432 InkWell.  <\/p>\n
 return InkWell(             onTap: () => FocusScope.of(context).unfocus(),             child: Column(\u2026)); <\/code><\/pre>\n
  \u0422\u0435\u043f\u0435\u0440\u044c \u043c\u043e\u0436\u043d\u043e \u0434\u043e\u0431\u0430\u0432\u0438\u0442\u044c \u043f\u0440\u043e\u0441\u0442\u043e\u0439 FocusNode \u0432 Widget   <\/p>\n
 \u2026     _focusNode = FocusNode();     _focusNode.addListener(() {   if (!_focusNode.hasFocus) {         store.form.controls.name.setTouched(true);       }       store.form.controls.name.setFocused(_focusNode.hasFocus);    });  \u2026 <\/code><\/pre>\n
  \u0415\u0441\u0442\u0435\u0441\u0442\u0432\u0435\u043d\u043d\u043e \u043f\u0438\u0441\u0430\u0442\u044c \u043e\u0434\u043d\u043e\u0442\u0438\u043f\u043d\u044b\u0439 \u043a\u043e\u0434 \u043a\u0430\u0436\u0434\u044b\u0439 \u0440\u0430\u0437 \u0433\u043b\u0443\u043f\u043e \u0438 \u0441\u043a\u0443\u0447\u043d\u043e. \u041f\u043e\u044d\u0442\u043e\u043c\u0443 \u0432\u043d\u0443\u0442\u0440\u0438 FormControl \u0443\u0436\u0435 \u0432\u0448\u0438\u0442\u043e \u043f\u043e\u0434\u043e\u0431\u043d\u043e\u0435 \u043f\u043e\u043b\u0435 focusNode.
  \u0418\u0442\u043e\u0433\u043e \u043a\u043e\u0434 \u0431\u0443\u0434\u0435\u0442 \u0442\u0430\u043a\u0438\u043c  <\/p>\n
 \u2026 TextField(                       focusNode: store.form.controls.name.focusNode,                       controller: store.form.controls.name.controller,                       onChanged: (String text) =>                           store.form.controls.name.value = text,                       decoration: InputDecoration(                         border: OutlineInputBorder(),                         labelText: "\u0418\u043c\u044f",                       )),                   if (store.form.controls.name.touched)                     ...store.form.controls.name.errors.map((error) => Text(                         error.message,                         style: TextStyle(color: Colors.red, fontSize: 15))) \u2026 <\/code><\/pre>\n
  ^^^^^^^  <\/p>\n
\n
  \u0412 \u0434\u0430\u043d\u043d\u043e\u043c \u0441\u043b\u0443\u0447\u0430\u0435 \u043c\u044b \u043e\u0442\u043e\u0431\u0440\u0430\u0436\u0430\u0435\u043c \u043e\u0448\u0438\u0431\u043a\u0443 \u043f\u043e\u0441\u043b\u0435 \u0442\u043e\u0433\u043e \u043a\u0430\u043a \u043f\u043e\u043b\u0435 \u00ab\u043f\u043e\u0442\u0440\u043e\u0433\u0430\u043b\u0438\u00bb (\u0442.\u0435. \u043e\u043d\u043e \u043f\u043e\u0442\u0435\u0440\u044f\u043b\u043e \u0444\u043e\u043a\u0443\u0441 \u0432 \u043f\u0435\u0440\u0432\u044b\u0439 \u0440\u0430\u0437).
  \u0421\u0435\u0439\u0447\u0430\u0441 \u043c\u044b \u043f\u043e\u0434\u043e\u0448\u043b\u0438 \u043a \u043c\u043e\u043c\u0435\u043d\u0442\u0443, \u0447\u0442\u043e \u0443\u0436 \u0431\u043e\u043b\u044c\u043d\u043e \u0447\u0430\u0441\u0442\u043e \u043f\u0438\u0448\u0435\u043c \u0441\u0442\u0440\u043e\u043a\u0443 store.form.controls.name<\/i>.
  \u0418 \u043b\u044e\u0431\u043e\u0435 \u0431\u043e\u043b\u044c\u0448\u043e\u0435 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0435 \u043f\u043e\u0434\u0440\u0430\u0437\u0443\u043c\u0435\u0432\u0430\u0435\u0442 \u043d\u0430\u043f\u0438\u0441\u0430\u043d\u0438\u0435 \u043e\u0431\u0435\u0440\u0442\u043a\u0438 \u043d\u0430\u0434 \u0441\u0442\u0430\u043d\u0434\u0430\u0440\u0442\u043d\u044b\u043c \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u043e\u043c \u0432\u0432\u043e\u0434\u0430, \u043c\u043e\u0436\u043d\u043e \u043a\u043e\u043d\u0435\u0447\u043d\u043e \u043a\u0430\u0436\u0434\u044b\u0439 \u0440\u0430\u0437 \u043a\u043e\u043f\u0438\u043f\u0430\u0441\u0442\u0438\u0442\u044c \u0441\u0442\u0440\u043e\u043a\u0438\u2026 \u041d\u043e\u2026 \u041d\u0435 \u0431\u0443\u0434\u0435\u043c \u043e \u0433\u0440\u0443\u0441\u0442\u043d\u043e\u043c)
  \u0412 \u0438\u0442\u043e\u0433\u0435, \u0441\u0435\u0439\u0447\u0430\u0441 \u043c\u044b \u0432\u044b\u043d\u0435\u0441\u0435\u043c \u043d\u0430\u0448\u0435 \u043f\u043e\u043b\u0435 \u0432\u0432\u043e\u0434\u0430 \u0432 \u043e\u0442\u0434\u0435\u043b\u044c\u043d\u044b\u0439 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442.
  \u0418 \u043d\u0430\u0447\u043d\u0435\u043c \u0440\u0430\u0437\u0431\u043e\u0440 \u043b\u043e\u0433\u0438\u043a\u0438 \u0432\u0430\u043b\u0438\u0434\u0430\u0446\u0438\u0439.  <\/p>\n
\n
  TypeScript<\/b>
    <\/p>\n
\n
  Flutter<\/b>
  
  
  ^^^^^^^  <\/p>\n
\n
  \u041a\u0430\u043a \u043c\u043e\u0436\u043d\u043e \u0437\u0430\u043c\u0435\u0442\u0438\u0442\u044c \u043d\u0438\u043a\u0430\u043a\u0438\u0445 \u0441\u043b\u043e\u0436\u043d\u044b \u043c\u0430\u043d\u0438\u043f\u0443\u043b\u044f\u0446\u0438\u0439 \u0441 \u043a\u043e\u0434\u043e\u043c \u043c\u044b \u043d\u0435 \u043f\u0440\u043e\u0432\u0435\u043b\u0438.
  \u0425\u043e\u0442\u044f \u0432 \u043f\u0440\u0438\u043c\u0435\u0440\u0430\u0445 \u0438 \u0443\u043a\u0430\u0437\u044b\u0432\u0430\u0435\u0442\u0441\u044f \u0442\u043e\u043b\u044c\u043a\u043e string, \u043d\u043e FormControl \u0440\u0430\u0431\u043e\u0442\u0430\u0435\u0442 \u0441 \u0430\u0431\u0441\u043e\u043b\u044e\u0442\u043d\u043e \u043b\u044e\u0431\u044b\u043c \u0442\u0438\u043f\u043e\u043c \u0432 \u0432\u043a\u043b\u044e\u0447\u0430\u044f \u0432\u0430\u0448\u0438 \u0441\u043e\u0431\u0441\u0442\u0432\u0435\u043d\u043d\u044b\u0435.<\/p>\n
\u0421\u043e\u0441\u0442\u043e\u044f\u043d\u0438\u0435 \u043a\u043e\u043d\u0442\u0440\u043e\u043b\u0430<\/h2>\n
  \u0412 \u043f\u0440\u0435\u0434\u044b\u0434\u0443\u0449\u0435\u0439 \u0433\u043b\u0430\u0432\u0435 \u043c\u044b \u0440\u0430\u0437\u043e\u0431\u0440\u0430\u043b\u0438 \u0438\u043c\u0435\u043d\u043d\u043e \u0442\u0443 \u0447\u0430\u0441\u0442\u044c FormControl-\u043e\u0432 \u043a\u043e\u0442\u043e\u0440\u0443\u044e \u044f \u0442\u0430\u043a \u0441\u0438\u043b\u044c\u043d\u043e \u0443\u043f\u0440\u043e\u0441\u0442\u0438\u043b \u0432 \u0441\u0432\u043e\u0435\u0439 \u043f\u0435\u0440\u0432\u043e\u0439 \u0441\u0442\u0430\u0442\u044c\u0435 "\u041d\u043e\u0432\u044b\u0439 \u043f\u0430\u043a\u0435\u0442 \u0432\u0430\u043b\u0438\u0434\u0430\u0446\u0438\u0439 \u0434\u043b\u044f React \u043d\u0430 Mobx @quantumart\/mobx-form-validation-kit<\/a>
  \u042f \u043f\u043e\u0441\u0442\u0430\u0440\u0430\u043b\u0441\u044f \u0440\u0430\u0441\u0441\u043a\u0430\u0437\u0430\u0442\u044c, \u043a\u0430\u043a \u0438\u0445 \u0441\u043e\u0437\u0434\u0430\u0432\u0430\u0442\u044c \u0438 \u043a\u0430\u043a \u043e\u043d\u0438 \u043d\u0430\u0442\u0438\u0432\u043d\u043e \u0440\u0430\u0431\u043e\u0442\u0430\u044e\u0442.
  \u0414\u0430\u043b\u0435\u0435 \u044f \u043f\u043e\u0432\u0435\u0434\u0430\u044e \u043a\u0430\u043a \u0440\u0430\u0431\u043e\u0442\u0430\u0442\u044c \u0441 \u0432\u0430\u043b\u0438\u0434\u0430\u0446\u0438\u044f\u043c\u0438 \u0438 \u043a\u0430\u043a \u0441\u043e\u0437\u0434\u0430\u0432\u0430\u0442\u044c \u0441\u043e\u0431\u0441\u0442\u0432\u0435\u043d\u043d\u044b\u0435.
  \u041d\u043e \u0434\u043b\u044f \u043d\u0430\u0447\u0430\u043b\u0430 \u0440\u0430\u0437\u0431\u0435\u0440\u0435\u043c \u0441\u0442\u0440\u0443\u043a\u0442\u0443\u0440\u0443 \u0432\u043b\u043e\u0436\u0435\u043d\u043d\u043e\u0441\u0442\u0438 \u043a\u043e\u043d\u0442\u0440\u043e\u043b\u043b\u0435\u0440\u043e\u0432 \u0438 \u0438\u0445 \u0432\u043e\u0437\u043c\u043e\u0436\u043d\u043e\u0441\u0442\u0438.
  \u0411\u0438\u0431\u043b\u0438\u043e\u0442\u0435\u043a\u0430 mobx-form-validation-kit \u0438\u043c\u0435\u0435\u0442 \u0442\u0440\u0438 \u043e\u0441\u043d\u043e\u0432\u043d\u044b\u0445 \u0442\u0438\u043f\u0430 \u0443\u0437\u043b\u043e\u0432:
  \u2022 FormGroup<\/b> \u2013 \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u0435\u0442 \u043e\u0431\u044a\u0435\u0434\u0438\u043d\u044f\u0442\u044c \u0432\u0430\u043b\u0438\u0434\u0430\u0446\u0438\u043e\u043d\u043d\u044b\u0435 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u044b \u0432\u043c\u0435\u0441\u0442\u0435. \u041a\u043b\u0430\u0441\u0441 \u0442\u0438\u043f\u0438\u0437\u0438\u0440\u043e\u0432\u0430\u043d\u043d\u044b\u0439, \u0438 \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u0435\u0442 \u043f\u0435\u0440\u0435\u0434\u0430\u0442\u044c \u0432 \u043a\u0430\u0447\u0435\u0441\u0442\u0432\u0435 generic \u043f\u0430\u0440\u0430\u043c\u0435\u0442\u0440\u0430 \u0438\u043d\u0442\u0435\u0440\u0444\u0435\u0439\u0441 \u0441\u043e \u0441\u043f\u0438\u0441\u043a\u043e\u043c \u043f\u043e\u043b\u0435\u0439. 
  \u2022 FormControl<\/b> \u2013 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u0442\u0441\u044f \u0434\u043b\u044f \u0432\u0430\u043b\u0438\u0434\u0430\u0446\u0438\u0438 \u043a\u043e\u043d\u043a\u0440\u0435\u0442\u043d\u043e\u0433\u043e \u043f\u043e\u043b\u044f, \u043d\u0430\u0438\u0431\u043e\u043b\u0435\u0435 \u0447\u0430\u0441\u0442\u043e \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u043c\u044b\u0439 \u043a\u043b\u0430\u0441\u0441. \u041a\u043b\u0430\u0441\u0441 \u0442\u0438\u043f\u0438\u0437\u0438\u0440\u043e\u0432\u0430\u043d\u043d\u044b\u0439, \u0438 \u0432 \u043a\u0430\u0447\u0435\u0441\u0442\u0432\u0435 generic \u043f\u0430\u0440\u0430\u043c\u0435\u0442\u0440\u0430 \u043f\u0440\u0438\u043d\u0438\u043c\u0430\u0435\u0442 \u0442\u0438\u043f \u043f\u0435\u0440\u0435\u043c\u0435\u043d\u043d\u043e\u0439 \u043a\u043e\u0442\u043e\u0440\u043e\u0439 \u0434\u043e\u043b\u0436\u0435\u043d \u0445\u0440\u0430\u043d\u0438\u0442\u044c.
  \u2022 FormArray<\/b> \u2013 \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u0435\u0442 \u0441\u043e\u0437\u0434\u0430\u0432\u0430\u0442\u044c \u0438 \u0443\u043f\u0440\u0430\u0432\u043b\u044f\u0442\u044c \u043c\u0430\u0441\u0441\u0438\u0432\u043e\u043c \u0432\u0430\u043b\u0438\u0434\u0430\u0446\u0438\u043e\u043d\u043d\u044b\u0445 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u043e\u0432.<\/p>\n
  \u0421\u0430\u043c\u0438 \u0443\u0437\u043b\u044b \u043c\u043e\u0436\u043d\u043e \u0441\u043a\u043b\u0430\u0434\u044b\u0432\u0430\u0442\u044c \u0432 \u0434\u0440\u0435\u0432\u043e\u0432\u0438\u0434\u043d\u043e\u043c \u0441\u0442\u0438\u043b\u0435. \u041f\u043e\u0434\u0434\u0435\u0440\u0436\u0438\u0432\u0430\u0435\u0442\u0441\u044f \u043b\u044e\u0431\u043e\u0439 \u0443\u0440\u043e\u0432\u0435\u043d\u044c \u0432\u043b\u043e\u0436\u0435\u043d\u043d\u043e\u0441\u0442\u0438, \u043d\u043e \u043e\u0431\u044b\u0447\u043d\u043e \u0432\u0441\u0435 \u043d\u0430\u0447\u0438\u043d\u0430\u0435\u0442\u0441\u044f \u0432 FormGroup.
  FormGroup
   \u2014 FormControl
   \u2014 FormControl
   \u2014  \u2014 FormGroup
   \u2014  \u2014 FormArray
   \u2014  \u2014  \u2014 FormGroup
   \u2014  \u2014  \u2014  \u2014 FormControl
   \u2014  \u2014 FormArray
   \u2014  \u2014  \u2014 FormControl<\/p>\n
  \u041a\u0430\u0436\u0434\u044b\u0439 \u043e\u0431\u044a\u0435\u043a\u0442 \u043a\u043b\u0430\u0441\u0441\u0430 \u043f\u043e\u0434\u0434\u0435\u0440\u0436\u0438\u0432\u0430\u0435\u0442 \u0441\u043b\u0435\u0434\u0443\u044e\u0449\u0438\u0439 \u043d\u0430\u0431\u043e\u0440 \u043e\u043f\u0446\u0438\u0439 \u043f\u0440\u0438 \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0435\u043d\u0438\u0438:
  \u2022 validators<\/b>: ValidatorsFunction[] \u2013 \u043d\u0430\u0431\u043e\u0440 \u0432\u0430\u043b\u0438\u0434\u0430\u0442\u043e\u0440\u043e\u0432.
  \u2022 activate<\/b>: (() => boolean) | null \u2014 \u0444\u0443\u043d\u043a\u0446\u0438\u044f \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u0442 \u0432\u043a\u043b\u044e\u0447\u0430\u0442\u044c\/\u043e\u0442\u043a\u043b\u044e\u0447\u0430\u0442\u044c \u0432\u0430\u043b\u0438\u0434\u0430\u0446\u0438\u0438 \u043f\u043e \u0443\u0441\u043b\u043e\u0432\u0438\u044e (\u043f\u043e \u0443\u043c\u043e\u043b\u0447\u0430\u043d\u0438\u044e \u0432\u043a\u043b\u044e\u0447\u0435\u043d\u043e \u0432\u0441\u0435\u0433\u0434\u0430). \u041d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, \u0432\u0430\u043b\u0438\u0434\u043d\u043e\u0441\u0442\u044c \u0434\u0430\u0442\u044b \u043e\u043a\u043e\u043d\u0447\u0430\u043d\u0438\u044f \u0443\u0441\u043b\u0443\u0433\u0438 \u043d\u0435 \u043d\u0443\u0436\u043d\u043e \u043f\u0440\u043e\u0432\u0435\u0440\u044f\u0442\u044c, \u0435\u0441\u043b\u0438 \u043d\u0435 \u0441\u0442\u043e\u0438\u0442 \u0433\u0430\u043b\u043e\u0447\u043a\u0430 \u00ab\u0411\u0435\u0437\u043b\u0438\u043c\u0438\u0442\u043d\u044b\u0439\u00bb. \u041a\u0430\u043a \u0441\u043b\u0435\u0434\u0441\u0442\u0432\u0438\u0435, \u043f\u0440\u043e\u0441\u0442\u043e \u0432\u043f\u0438\u0441\u0430\u0432 \u0441\u044e\u0434\u0430 \u0444\u0443\u043d\u043a\u0446\u0438\u044e \u043a\u043e\u0442\u043e\u0440\u0430\u044f \u043f\u0440\u043e\u0432\u0435\u0440\u0438\u0432 \u0441\u043e\u0441\u0442\u043e\u044f\u043d\u0438\u0435 observable \u043f\u043e\u043b\u044f \u043e\u0442\u0432\u0435\u0447\u0430\u044e\u0449\u0435\u0433\u043e \u0437\u0430 \u0447\u0435\u043a\u0431\u043e\u043a\u0441 \u00ab\u0411\u0435\u0437\u043b\u0438\u043c\u0438\u0442\u043d\u044b\u0439\u00bb, \u043c\u043e\u0436\u043d\u043e \u0430\u0432\u0442\u043e\u043c\u0430\u0442\u0438\u0447\u0435\u0441\u043a\u0438 \u043e\u0442\u043a\u043b\u044e\u0447\u0438\u0442\u044c \u0432\u0441\u0435 \u0432\u0430\u043b\u0438\u0434\u0430\u0446\u0438\u0438 \u043f\u0440\u0438\u0432\u044f\u0437\u0430\u043d\u043d\u044b\u0435 \u043a \u043f\u043e\u043b\u044e \u043d\u0430 \u043f\u0440\u043e\u0432\u0435\u0440\u043a\u0443 \u0434\u0430\u0442\u044b, \u0430 \u043d\u0435 \u043f\u0440\u043e\u043f\u0438\u0441\u044b\u0432\u0430\u0442\u044c \u044d\u0442\u0443 \u043b\u043e\u0433\u0438\u043a\u0443 \u0432 \u043a\u0430\u0436\u0434\u0443\u044e \u0438\u0437 \u0432\u0430\u043b\u0438\u0434\u0430\u0446\u0438\u0439 \u043f\u043e\u043b\u044f \u0434\u0430\u0442\u0430.
  \u2022 additionalData<\/b>: any \/ dynamic \u2014 \u0431\u043b\u043e\u043a \u0441 \u0434\u043e\u043f\u043e\u043b\u043d\u0438\u0442\u0435\u043b\u044c\u043d\u043e\u0439 \u0438\u043d\u0444\u043e\u0440\u043c\u0430\u0446\u0438\u0435\u0439 \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u0435\u0442 \u0434\u043e\u0431\u0430\u0432\u0438\u0442\u044c \u0434\u043e\u043f\u043e\u043b\u043d\u0438\u0442\u0435\u043b\u044c\u043d\u0443\u044e \u0438\u043d\u0444\u043e\u0440\u043c\u0430\u0446\u0438\u044e \u043a \u043a\u043e\u043d\u043a\u0440\u0435\u0442\u043d\u043e\u043c\u0443 FormControl \u0438 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c \u0438\u0445 \u0432 \u0434\u0430\u043b\u044c\u043d\u0435\u0439\u0448\u0435\u043c, \u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, \u0434\u043b\u044f \u0432\u0438\u0437\u0443\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u0438. \u042d\u0442\u043e \u0443\u0434\u043e\u0431\u043d\u043e, \u0435\u0441\u043b\u0438 \u0435\u0441\u0442\u044c \u0431\u0438\u043b\u0434\u0435\u0440\u044b \u0434\u043b\u044f FormControl \u0432 \u043a\u043e\u0442\u043e\u0440\u044b\u0445 \u043d\u0443\u0436\u043d\u043e \u0437\u0430\u0445\u0430\u0440\u043a\u043e\u0434\u0438\u0442\u044c \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0451\u043d\u043d\u0443\u044e \u0438\u043d\u0444\u043e\u0440\u043c\u0430\u0446\u0438\u044e, \u0430 \u043d\u0435 \u043f\u0435\u0440\u0435\u0434\u0430\u0432\u0430\u0442\u044c \u044d\u0442\u0443 \u0438\u043d\u0444\u043e\u0440\u043c\u0430\u0446\u0438\u044e \u0447\u0435\u0440\u0435\u0437 \u0441\u043b\u043e\u0436\u043d\u0443\u044e \u0441\u0432\u044f\u0437\u043a\u0443 \u0434\u0430\u043d\u043d\u044b\u0445 \u0432 \u043a\u043e\u043d\u0442\u0440\u043e\u043b\u044b \u0434\u043b\u044f \u0432\u0438\u0437\u0443\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u0438. \u0425\u043e\u0442\u044f \u0442\u043e\u0447\u043d\u043e\u0433\u043e \u0438 \u043d\u0435\u043e\u0441\u043f\u043e\u0440\u0438\u043c\u043e\u0433\u043e \u0441\u0446\u0435\u043d\u0430\u0440\u0438\u044f \u043f\u0440\u0438\u043c\u0435\u043d\u0435\u043d\u0438\u044f \u0434\u043b\u044f additionalData \u043c\u044b \u0442\u0430\u043a \u0438 \u043d\u0435 \u0441\u043c\u043e\u0433\u043b\u0438 \u043d\u0430\u0439\u0442\u0438, \u043d\u043e \u043b\u0443\u0447\u0448\u0435 \u0438\u043c\u0435\u0442\u044c \u0442\u0430\u043a\u0443\u044e \u0432\u043e\u0437\u043c\u043e\u0436\u043d\u043e\u0441\u0442\u044c, \u0447\u0435\u043c \u0441\u0442\u0440\u0430\u0434\u0430\u0442\u044c \u0431\u0435\u0437 \u043d\u0435\u0435.
  \u041a\u0440\u043e\u043c\u0435 \u044d\u0442\u043e\u0433\u043e \u0434\u043b\u044f FormControl \u0435\u0441\u0442\u044c \u0434\u043e\u043f\u043e\u043b\u043d\u0438\u0442\u0435\u043b\u044c\u043d\u044b\u0439 \u043d\u0430\u0431\u043e\u0440 \u043e\u043f\u0446\u0438\u0439:
  \u2022 onChangeValue<\/b>: UpdateValidValueHandler | null \u2014 \u0421\u0440\u0430\u0431\u0430\u0442\u044b\u0432\u0430\u0435\u0442 \u0432\u0441\u0435\u0433\u0434\u0430 \u043f\u0440\u0438 \u0438\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u0438 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u044f
  \u2022 onChangeValidValue<\/b>: UpdateValidValueHandler | null \u2014 \u043f\u0435\u0440\u0435\u0434\u0430\u0435\u0442 \u043f\u043e\u0441\u043b\u0435\u0434\u043d\u0435\u0435 \u0432\u0430\u043b\u0438\u0434\u043d\u043e\u0435 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435
  \u2022 callSetterOnInitialize<\/b>: boolean \u2014 \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u0435\u0442 \u0432\u044b\u0437\u0432\u0430\u0442\u044c `onChangeValidValue` \u043f\u0440\u0438 \u0441\u043e\u0437\u0434\u0430\u043d\u0438\u0438 `FormControl`.
  \u2022 callSetterOnReinitialize<\/b>: boolean \u2014 \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u0435\u0442 \u0432\u044b\u0437\u044b\u0432\u0430\u0442\u044c `onChangeValidValue` \u043f\u0440\u0438 \u043a\u0430\u0436\u0434\u043e\u043c \u0438\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u0438 \u0440\u0435\u0437\u0443\u043b\u044c\u0442\u0430\u0442\u0430 \u0444\u0443\u043d\u043a\u0446\u0438\u0438-\u0433\u0435\u0442\u0442\u0435\u0440\u0430 \u0438\u0437 \u043f\u0435\u0440\u0432\u043e\u0433\u043e \u0430\u0440\u0433\u0443\u043c\u0435\u043d\u0442\u0430.<\/p>\n
  \u041a\u0430\u0436\u0434\u044b\u0439 \u044d\u043b\u0435\u043c\u0435\u043d\u0442 \u0434\u0435\u0440\u0435\u0432\u0430 \u043f\u043e\u0434\u0434\u0435\u0440\u0436\u0438\u0432\u0430\u0435\u0442 \u0441\u043b\u0435\u0434\u0443\u044e\u0449\u0438\u0439 \u043d\u0430\u0431\u043e\u0440 \u043f\u043e\u043b\u0435\u0439
  \u2022 processing<\/b>: boolean \u2014 \u0432 \u043f\u0440\u043e\u0446\u0435\u0441\u0441\u0435 \u0430\u043d\u0430\u043b\u0438\u0437\u0430. mobx-form-validation-kit \u043f\u043e\u0434\u0434\u0435\u0440\u0436\u0438\u0432\u0430\u0435\u0442 \u0430\u0441\u0438\u043d\u0445\u0440\u043e\u043d\u043d\u044b\u0435 \u0432\u0430\u043b\u0438\u0434\u0430\u0446\u0438\u0438, \u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440 \u0442\u0435, \u0447\u0442\u043e \u0442\u0440\u0435\u0431\u0443\u044e\u0442 \u0437\u0430\u043f\u0440\u043e\u0441\u0430 \u043d\u0430 \u0441\u0435\u0440\u0432\u0435\u0440. \u0422\u0435\u043a\u0443\u0449\u0435\u0435 \u0441\u043e\u0441\u0442\u043e\u044f\u043d\u0438\u0435 \u043f\u0440\u043e\u0432\u0435\u0440\u043a\u0438 \u043c\u043e\u0436\u043d\u043e \u0443\u0437\u043d\u0430\u0442\u044c \u043f\u043e \u0434\u0430\u043d\u043d\u043e\u043c\u0443 \u043f\u043e\u043b\u044e.
  \u041a\u0440\u043e\u043c\u0435 \u044d\u0442\u043e\u0433\u043e \u043f\u043e\u0434\u0434\u0435\u0440\u0436\u0438\u0432\u0430\u0435\u0442\u0441\u044f \u043c\u0435\u0442\u043e\u0434 wait, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u0435\u0442 \u0434\u043e\u0436\u0434\u0430\u0442\u044c\u0441\u044f \u043e\u043a\u043e\u043d\u0447\u0430\u043d\u0438\u044f \u043f\u0440\u043e\u0432\u0435\u0440\u043a\u0438. \u041d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, \u043f\u0440\u0438 \u043d\u0430\u0436\u0430\u0442\u0438\u0438 \u043d\u0430 \u043a\u043d\u043e\u043f\u043a\u0443 \u00ab\u043e\u0442\u043f\u0440\u0430\u0432\u0438\u0442\u044c \u0434\u0430\u043d\u043d\u044b\u0435\u00bb \u043d\u0443\u0436\u043d\u043e \u043f\u0440\u043e\u043f\u0438\u0441\u0430\u0442\u044c \u0441\u043b\u0435\u0434\u0443\u044e\u0449\u0443\u044e \u043a\u043e\u043d\u0441\u0442\u0440\u0443\u043a\u0446\u0438\u044e.  <\/p>\n
 await this.form.wait(); if (this.form.invalid) { \u2026<\/code><\/pre>\n
  \u2022 disabled<\/b>: boolean \u2014 \u043f\u0440\u043e\u0432\u0435\u0440\u043a\u0430 \u043e\u0448\u0438\u0431\u043e\u043a \u043e\u0442\u043a\u043b\u044e\u0447\u0435\u043d\u0430 (\u043a\u043e\u043d\u0442\u0440\u043e\u043b \u0432\u0441\u0435\u0433\u0434\u0430 \u0432\u0430\u043b\u0438\u0434\u0435\u043d)
  \u2022 active<\/b>: boolean \u2014 \u043f\u0440\u043e\u0432\u0435\u0440\u043a\u0430 \u043e\u0448\u0438\u0431\u043e\u043a \u0432\u043a\u043b\u044e\u0447\u0435\u043d\u0430. \u0417\u0430\u0432\u0438\u0441\u0438\u0442 \u043e\u0442 \u0440\u0435\u0437\u0443\u043b\u044c\u0442\u0430\u0442\u0430 \u0432\u044b\u043f\u043e\u043b\u043d\u0435\u043d\u0438\u044f \u0444\u0443\u043d\u043a\u0446\u0438\u0438 \u0430\u043a\u0442\u0438\u0432\u0430\u0446\u0438\u0438. \u0414\u0430\u043d\u043d\u043e\u0435 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435 \u043e\u0447\u0435\u043d\u044c \u0443\u0434\u043e\u0431\u043d\u043e \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c \u0434\u043b\u044f \u0441\u043a\u0440\u044b\u0442\u0438\u044f \u0433\u0440\u0443\u043f\u043f\u044b \u043f\u043e\u043b\u0435\u0439 \u043d\u0430 \u0444\u043e\u0440\u043c\u0435 \u0438 \u043d\u0435 \u043f\u0438\u0441\u0430\u0442\u044c \u0434\u043e\u043f\u043e\u043b\u043d\u0438\u0442\u0435\u043b\u044c\u043d\u044b\u0435 \u0438 \u0434\u0443\u0431\u043b\u0438\u0440\u0443\u044e\u0449\u0438\u0435 \u0444\u0443\u043d\u043a\u0446\u0438\u0438 \u0431\u0438\u0437\u043d\u0435\u0441 \u043b\u043e\u0433\u0438\u043a\u0438.
  \u2022 invalid<\/b>: boolean \u2014 \u0434\u043b\u044f FormControl \u2013 \u043e\u0437\u043d\u0430\u0447\u0430\u0435\u0442, \u0447\u0442\u043e \u043f\u043e\u043b\u0435 \u0441\u043e\u0434\u0435\u0440\u0436\u0438\u0442 \u0432\u0430\u043b\u0438\u0434\u0430\u0446\u0438\u043e\u043d\u043d\u044b\u0435 \u043e\u0448\u0438\u0431\u043a\u0438. \u0414\u043b\u044f FormGroup \u0438 FormArray \u043e\u0437\u043d\u0430\u0447\u0430\u0435\u0442, \u043b\u0438\u0431\u043e \u0441\u0430\u043c \u0433\u0440\u0443\u043f\u043f\u043e\u0432\u043e\u0439 \u043a\u043e\u043d\u0442\u0440\u043e\u043b \u0441\u043e\u0434\u0435\u0440\u0436\u0438\u0442 \u043e\u0448\u0438\u0431\u043a\u0438, \u043b\u0438\u0431\u043e \u043e\u0434\u043d\u043e \u0438\u0437 \u0432\u043b\u043e\u0436\u0435\u043d\u043d\u044b\u0445 \u043f\u043e\u043b\u0435\u0439 (\u043d\u0430 \u043b\u044e\u0431\u043e\u043c \u0438\u0437 \u0443\u0440\u043e\u0432\u043d\u0435\u0439 \u0432\u043b\u043e\u0436\u0435\u043d\u043d\u043e\u0441\u0442\u0438) \u0441\u043e\u0434\u0435\u0440\u0436\u0438\u0442 \u043e\u0448\u0438\u0431\u043a\u0438 \u0432\u0430\u043b\u0438\u0434\u0430\u0446\u0438\u0438. \u0422.\u0435. \u0434\u043b\u044f \u043f\u0440\u043e\u0432\u0435\u0440\u043a\u0438 \u0432\u0430\u043b\u0438\u0434\u043d\u043e\u0441\u0442\u0438 \u0432\u0441\u0435\u0439 \u0444\u043e\u0440\u043c\u044b \u0434\u043e\u0441\u0442\u0430\u0442\u043e\u0447\u043d\u043e \u0432\u044b\u043f\u043e\u043b\u043d\u0438\u0442\u044c \u043e\u0434\u043d\u0443 \u043f\u0440\u043e\u0432\u0435\u0440\u043a\u0443 invalid \u0438\u043b\u0438 valid \u0432\u0435\u0440\u0445\u043d\u0435\u0433\u043e FormGroup.
  \u2022 valid<\/b>: boolean \u2014 \u0434\u043b\u044f FormControl \u2013 \u043e\u0437\u043d\u0430\u0447\u0430\u0435\u0442, \u0447\u0442\u043e \u043f\u043e\u043b\u0435 \u043d\u0435 \u0441\u043e\u0434\u0435\u0440\u0436\u0438\u0442 \u0432\u0430\u043b\u0438\u0434\u0430\u0446\u0438\u043e\u043d\u043d\u044b\u0435 \u043e\u0448\u0438\u0431\u043a\u0438. \u0414\u043b\u044f FormGroup \u0438 FormArray \u043e\u0437\u043d\u0430\u0447\u0430\u0435\u0442, \u043b\u0438\u0431\u043e \u0441\u0430\u043c \u0433\u0440\u0443\u043f\u043f\u043e\u0432\u043e\u0439 \u043a\u043e\u043d\u0442\u0440\u043e\u043b \u043d\u0435 \u0441\u043e\u0434\u0435\u0440\u0436\u0438\u0442 \u043e\u0448\u0438\u0431\u043a\u0438, \u0438 \u043d\u0438 \u043e\u0434\u043d\u043e \u0438\u0437 \u0432\u043b\u043e\u0436\u0435\u043d\u043d\u044b\u0445 \u043f\u043e\u043b\u0435\u0439 (\u043d\u0430 \u043b\u044e\u0431\u043e\u043c \u0438\u0437 \u0443\u0440\u043e\u0432\u043d\u0435\u0439 \u0432\u043b\u043e\u0436\u0435\u043d\u043d\u043e\u0441\u0442\u0438) \u043d\u0435 \u0441\u043e\u0434\u0435\u0440\u0436\u0438\u0442 \u043e\u0448\u0438\u0431\u043a\u0438 \u0432\u0430\u043b\u0438\u0434\u0430\u0446\u0438\u0438.
  \u2022 pristine<\/b>: boolean \u2014 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435 \u0432 \u043f\u043e\u043b\u0435, \u043f\u043e\u0441\u043b\u0435 \u0438\u043d\u0438\u0446\u0438\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u0438 \u0434\u0435\u0444\u043e\u043b\u0442\u043d\u044b\u043c \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435\u043c, \u043d\u0435 \u0438\u0437\u043c\u0435\u043d\u044f\u043b\u043e\u0441\u044c.
  \u2022 dirty<\/b>: boolean \u2014 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435 \u0432 \u043f\u043e\u043b\u0435, \u043f\u043e\u0441\u043b\u0435 \u0438\u043d\u0438\u0446\u0438\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u0438 \u0434\u0435\u0444\u043e\u043b\u0442\u043d\u044b\u043c \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435\u043c, \u043c\u0435\u043d\u044f\u043b\u043e\u0441\u044c.
  \u2022 untouched<\/b>: boolean \u2014 \u0434\u043b\u044f FormControl \u2013 \u043e\u0437\u043d\u0430\u0447\u0430\u0435\u0442, \u0447\u0442\u043e \u043f\u043e\u043b\u0435 (\u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440 input) \u043d\u0435 \u0431\u044b\u043b\u043e \u0432 \u0444\u043e\u043a\u0443\u0441\u0435. \u0414\u043b\u044f FormGroup \u0438 FormArray \u043e\u0437\u043d\u0430\u0447\u0430\u0435\u0442, \u0447\u0442\u043e \u043d\u0438 \u043e\u0434\u0438\u043d \u0438\u0437 \u0432\u043b\u043e\u0436\u0435\u043d\u043d\u044b\u0445 FormControl-\u043e\u0432 \u043d\u0435 \u0431\u044b\u043b \u0432 \u0444\u043e\u043a\u0443\u0441\u0435. \u0417\u043d\u0430\u0447\u0435\u043d\u0438\u0435 false \u0432 \u044d\u0442\u043e\u043c \u043f\u043e\u043b\u0435 \u043e\u0437\u043d\u0430\u0447\u0430\u0435\u0442, \u0447\u0442\u043e \u0444\u043e\u043a\u0443\u0441 \u0431\u044b\u043b \u043d\u0435 \u0442\u043e\u043b\u044c\u043a\u043e \u0431\u044b\u043b \u043f\u043e\u0441\u0442\u0430\u0432\u043b\u0435\u043d, \u043d\u043e \u0438 \u0441\u043d\u044f\u0442 \u0441 \u043f\u043e\u043b\u044f.
  \u2022 touched<\/b>: boolean \u2014 \u0414\u043b\u044f FormControl \u2013 \u043e\u0437\u043d\u0430\u0447\u0430\u0435\u0442, \u0447\u0442\u043e \u043f\u043e\u043b\u0435 (\u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440 input) \u0431\u044b\u043b\u043e \u0432 \u0444\u043e\u043a\u0443\u0441\u0435. \u0414\u043b\u044f FormGroup \u0438 FormArray \u043e\u0437\u043d\u0430\u0447\u0430\u0435\u0442, \u0447\u0442\u043e \u043e\u0434\u0438\u043d \u0438\u0437 \u0432\u043b\u043e\u0436\u0435\u043d\u043d\u044b\u0445 FormControl-\u043e\u0432 \u0431\u044b\u043b \u0432 \u0444\u043e\u043a\u0443\u0441\u0435. \u0417\u043d\u0430\u0447\u0435\u043d\u0438\u0435 true \u0432 \u044d\u0442\u043e\u043c \u043f\u043e\u043b\u0435 \u043e\u0437\u043d\u0430\u0447\u0430\u0435\u0442, \u0447\u0442\u043e \u0444\u043e\u043a\u0443\u0441 \u0431\u044b\u043b \u043d\u0435 \u0442\u043e\u043b\u044c\u043a\u043e \u0431\u044b\u043b \u043f\u043e\u0441\u0442\u0430\u0432\u043b\u0435\u043d, \u043d\u043e \u0438 \u0441\u043d\u044f\u0442 \u0441 \u043f\u043e\u043b\u044f.
  \u2022 focused<\/b>: boolean \u2014 \u0434\u043b\u044f FormControl \u2013 \u043e\u0437\u043d\u0430\u0447\u0430\u0435\u0442, \u0447\u0442\u043e \u043f\u043e\u043b\u0435 (\u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440 input) \u0441\u0435\u0439\u0447\u0430\u0441 \u0432 \u0444\u043e\u043a\u0443\u0441\u0435. \u0414\u043b\u044f FormGroup \u0438 FormArray \u043e\u0437\u043d\u0430\u0447\u0430\u0435\u0442, \u0447\u0442\u043e \u043e\u0434\u0438\u043d \u0438\u0437 \u0432\u043b\u043e\u0436\u0435\u043d\u043d\u044b\u0445 FormControl-\u043e\u0432 \u0441\u0435\u0439\u0447\u0430\u0441 \u0432 \u0444\u043e\u043a\u0443\u0441\u0435.
  \u2022 errors<\/b>: ValidationEvent[] \u2014 \u043f\u043e\u043b\u0435 \u0441\u043e\u0434\u0435\u0440\u0436\u0438\u0442 \u043e\u0448\u0438\u0431\u043a\u0438 \u0432\u0430\u043b\u0438\u0434\u0430\u0446\u0438\u0438. \u0412 \u043e\u0442\u043b\u0438\u0447\u0438\u0438 \u043e\u0442 \u043f\u0435\u0440\u0435\u0447\u0438\u0441\u043b\u0435\u043d\u043d\u044b\u0445 \u043f\u043e\u043b\u0435\u0439, \u0434\u0430\u043d\u043d\u044b\u0439 \u043c\u0430\u0441\u0441\u0438\u0432 \u0441\u043e\u0434\u0435\u0440\u0436\u0438\u0442 \u0438\u043c\u0435\u043d\u043d\u043e \u043e\u0448\u0438\u0431\u043a\u0438 \u043b\u0438\u0431\u043e FormControl, \u043b\u0438\u0431\u043e FormGroup, \u043b\u0438\u0431\u043e FormArray, \u0442.\u0435. \u043e\u0448\u0438\u0431\u043a\u0438 \u0434\u0430\u043d\u043d\u043e\u0433\u043e \u043a\u043e\u043d\u0442\u0440\u043e\u043b\u0430, \u0430 \u043d\u0435 \u0432\u0441\u0435 \u0432\u043b\u043e\u0436\u0435\u043d\u043d\u044b\u0435. \u0412\u043b\u0438\u044f\u0435\u0442 \u043d\u0430 \u043f\u043e\u043b\u0435 valid \/ invalid
  \u2022 warnings<\/b>: ValidationEvent[] \u2014 \u043f\u043e\u043b\u0435 \u0441\u043e\u0434\u0435\u0440\u0436\u0438\u0442 \u0441\u043e\u043e\u0431\u0449\u0435\u043d\u0438\u044f \u00ab\u0412\u043d\u0438\u043c\u0430\u043d\u0438\u0435\u00bb. \u0412 \u043e\u0442\u043b\u0438\u0447\u0438\u0438 \u043e\u0442 \u043f\u0435\u0440\u0435\u0447\u0438\u0441\u043b\u0435\u043d\u043d\u044b\u0445 \u043f\u043e\u043b\u0435\u0439, \u0434\u0430\u043d\u043d\u044b\u0439 \u043c\u0430\u0441\u0441\u0438\u0432 \u0441\u043e\u0434\u0435\u0440\u0436\u0438\u0442 \u0438\u043c\u0435\u043d\u043d\u043e \u043e\u0448\u0438\u0431\u043a\u0438 \u043b\u0438\u0431\u043e FormControl, \u043b\u0438\u0431\u043e FormGroup, \u043b\u0438\u0431\u043e FormArray, \u0442.\u0435. \u0441\u043e\u043e\u0431\u0449\u0435\u043d\u0438\u044f \u0434\u0430\u043d\u043d\u043e\u0433\u043e \u043a\u043e\u043d\u0442\u0440\u043e\u043b\u0430, \u0430 \u043d\u0435 \u0432\u0441\u0435 \u0432\u043b\u043e\u0436\u0435\u043d\u043d\u044b\u0435. \u041d\u0435 \u0432\u043b\u0438\u044f\u0435\u0442 \u043d\u0430 \u043f\u043e\u043b\u0435 valid \/ invalid
  \u2022 informationMessages<\/b>: ValidationEvent[] \u2014 \u043f\u043e\u043b\u0435 \u0441\u043e\u0434\u0435\u0440\u0436\u0438\u0442 \u0441\u043e\u043e\u0431\u0449\u0435\u043d\u0438\u044f \u00ab\u0438\u043d\u0444\u043e\u0440\u043c\u0430\u0446\u0438\u043e\u043d\u043d\u044b\u0435 \u0441\u043e\u043e\u0431\u0449\u0435\u043d\u0438\u044f\u00bb. \u0412 \u043e\u0442\u043b\u0438\u0447\u0438\u0438 \u043e\u0442 \u043f\u0435\u0440\u0435\u0447\u0438\u0441\u043b\u0435\u043d\u043d\u044b\u0445 \u043f\u043e\u043b\u0435\u0439, \u0434\u0430\u043d\u043d\u044b\u0439 \u043c\u0430\u0441\u0441\u0438\u0432 \u0441\u043e\u0434\u0435\u0440\u0436\u0438\u0442 \u0438\u043c\u0435\u043d\u043d\u043e \u043e\u0448\u0438\u0431\u043a\u0438 \u043b\u0438\u0431\u043e FormControl, \u043b\u0438\u0431\u043e FormGroup, \u043b\u0438\u0431\u043e FormArray, \u0442.\u0435. \u0441\u043e\u043e\u0431\u0449\u0435\u043d\u0438\u044f \u0434\u0430\u043d\u043d\u043e\u0433\u043e \u043a\u043e\u043d\u0442\u0440\u043e\u043b\u0430, \u0430 \u043d\u0435 \u0432\u0441\u0435 \u0432\u043b\u043e\u0436\u0435\u043d\u043d\u044b\u0435. \u041d\u0435 \u0432\u043b\u0438\u044f\u0435\u0442 \u043d\u0430 \u043f\u043e\u043b\u0435 valid \/ invalid
  \u2022 successes<\/b>: ValidationEvent \u2014 \u043f\u043e\u043b\u0435 \u0441\u043e\u0434\u0435\u0440\u0436\u0438\u0442 \u0434\u043e\u043f\u043e\u043b\u043d\u0438\u0442\u0435\u043b\u044c\u043d\u044b\u0435 \u0441\u043e\u043e\u0431\u0449\u0435\u043d\u0438\u044f \u043e \u0432\u0430\u043b\u0438\u0434\u043d\u043e\u0441\u0442\u0438. \u0412 \u043e\u0442\u043b\u0438\u0447\u0438\u0438 \u043e\u0442 \u043f\u0435\u0440\u0435\u0447\u0438\u0441\u043b\u0435\u043d\u043d\u044b\u0445 \u043f\u043e\u043b\u0435\u0439, \u0434\u0430\u043d\u043d\u044b\u0439 \u043c\u0430\u0441\u0441\u0438\u0432 \u0441\u043e\u0434\u0435\u0440\u0436\u0438\u0442 \u0438\u043c\u0435\u043d\u043d\u043e \u043e\u0448\u0438\u0431\u043a\u0438 \u043b\u0438\u0431\u043e FormControl, \u043b\u0438\u0431\u043e FormGroup, \u043b\u0438\u0431\u043e FormArray, \u0442.\u0435. \u0441\u043e\u043e\u0431\u0449\u0435\u043d\u0438\u044f \u0434\u0430\u043d\u043d\u043e\u0433\u043e \u043a\u043e\u043d\u0442\u0440\u043e\u043b\u0430, \u0430 \u043d\u0435 \u0432\u0441\u0435 \u0432\u043b\u043e\u0436\u0435\u043d\u043d\u044b\u0435. \u041d\u0435 \u0432\u043b\u0438\u044f\u0435\u0442 \u043d\u0430 \u043f\u043e\u043b\u0435 valid \/ invalid
  \u2022 maxEventLevel<\/b>() \u2013 \u043c\u0430\u043a\u0441\u0438\u043c\u0430\u043b\u044c\u043d\u044b\u0439 \u0443\u0440\u043e\u0432\u0435\u043d\u044c \u0432\u0430\u043b\u0438\u0434\u0430\u0446\u0438\u043e\u043d\u043d\u044b\u0445 \u0441\u043e\u043e\u0431\u0449\u0435\u043d\u0438\u0438 \u0441\u043e\u0434\u0435\u0440\u0436\u0430\u0449\u0438\u0445 \u0432 \u043f\u043e\u043b\u0435 \u0432 \u0442\u0435\u043a\u0443\u0449\u0438\u0439 \u043c\u043e\u043c\u0435\u043d\u0442.
  \u2022 \u041c\u0435\u0442\u043e\u0434 \u0432\u0435\u0440\u043d\u0435\u0442 \u043e\u0434\u043d\u043e \u0438\u0437 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0439 enum, \u0432 \u0441\u043b\u0435\u0434\u044f\u0449\u0435\u043c \u043f\u0440\u0438\u043e\u0440\u0438\u0442\u0435\u0442\u0435.
   1. ValidationEventTypes.Error;
   2. ValidationEventTypes.Warning;
   3. ValidationEventTypes.Info;
   4. ValidationEventTypes.Success;<\/p>\n
  \u2022 serverErrors<\/b>: string[] \u2013 \u043f\u043e\u0441\u043b\u0435 \u043e\u0442\u043f\u0440\u0430\u0432\u043a\u0438 \u0441\u043e\u043e\u0431\u0449\u0435\u043d\u0438\u044f \u043d\u0430 \u0441\u0435\u0440\u0432\u0435\u0440, \u0445\u043e\u0440\u043e\u0448\u0438\u043c \u0442\u043e\u043d\u043e\u043c \u044f\u0432\u043b\u044f\u0435\u0442\u0441\u044f \u043f\u0440\u043e\u0432\u0435\u0440\u043a\u0430 \u0432\u0430\u043b\u0438\u0434\u043d\u043e\u0441\u0442\u0438 \u0444\u043e\u0440\u043c\u044b \u0438 \u043d\u0430 \u0441\u0435\u0440\u0432\u0435\u0440\u0435. \u041a\u0430\u043a \u0441\u043b\u0435\u0434\u0441\u0442\u0432\u0438\u0435 \u0441\u0435\u0440\u0432\u0435\u0440 \u043c\u043e\u0436\u0435\u0442 \u0432\u0435\u0440\u043d\u0443\u0442\u044c \u043e\u0448\u0438\u0431\u043a\u0438 \u0444\u0438\u043d\u0430\u043b\u044c\u043d\u043e\u0439 \u043f\u0440\u043e\u0432\u0435\u0440\u043a\u0438 \u0444\u043e\u0440\u043c\u044b, \u0438 \u0438\u043c\u0435\u043d\u043d\u043e \u0434\u043b\u044f \u0442\u0430\u043a\u0438\u0445 \u044d\u0442\u0438\u0445 \u043e\u0448\u0438\u0431\u043e\u043a \u043f\u0440\u0435\u0434\u043d\u0430\u0437\u043d\u0430\u0447\u0430\u0435\u0442\u0441\u044f \u043c\u0430\u0441\u0441\u0438\u0432 serverErrors. \u041a\u043b\u044e\u0447\u0435\u0432\u043e\u0439 \u043e\u0441\u043e\u0431\u0435\u043d\u043d\u043e\u0441\u0442\u044c\u044e serverErrors \u2013 \u044f\u0432\u043b\u044f\u0435\u0442\u0441\u044f \u0430\u0432\u0442\u043e\u043c\u0430\u0442\u0438\u0447\u0435\u0441\u043a\u0430\u044f \u043e\u0447\u0438\u0441\u0442\u043a\u0430 \u0432\u0430\u043b\u0438\u0434\u0430\u0446\u0438\u043e\u043d\u043d\u044b\u0445 \u0441\u043e\u043e\u0431\u0449\u0435\u043d\u0438\u0439 \u043f\u0440\u0438 \u043f\u043e\u0442\u0435\u0440\u0435 \u0444\u043e\u043a\u0443\u0441\u0430 \u0441 \u043f\u043e\u043b\u044f \u043a \u043a\u043e\u0442\u043e\u0440\u043e\u043c\u0443 \u0431\u044b\u043b\u0438 \u043f\u0440\u0438\u0441\u0432\u043e\u0435\u043d\u044b \u0441\u0435\u0440\u0432\u0435\u0440\u043d\u044b\u0435 \u043e\u0448\u0438\u0431\u043a\u0438, \u0430 \u0442\u0430\u043a\u0436\u0435 \u043e\u0447\u0438\u0441\u0442\u043a\u0430 \u0441\u0435\u0440\u0432\u0435\u0440\u043d\u044b\u0445 \u043e\u0448\u0438\u0431\u043e\u043a \u043e\u0441\u0443\u0449\u0435\u0441\u0442\u0432\u043b\u044f\u0435\u0442\u0441\u044f \u0435\u0441\u043b\u0438 \u043f\u043e\u043b\u0435 \u0431\u044b\u043b\u043e \u0438\u0437\u043c\u0435\u043d\u0435\u043d\u043e.
  \u2022 setDirty(dirty: boolean)<\/b>: void \u2013 \u043c\u0435\u0442\u043e\u0434 \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u0435\u0442 \u0438\u0437\u043c\u0435\u043d\u0438\u0442\u044c \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435 \u043f\u043e\u043b\u0435\u0439 pristine \/ dirty
  \u2022 setTouched(touched: boolean)<\/b>: void \u2013 \u043c\u0435\u0442\u043e\u0434 \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u0435\u0442 \u0438\u0437\u043c\u0435\u043d\u0438\u0442\u044c \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435 \u043f\u043e\u043b\u0435\u0439 untouched \/ touched
  \u2022 setFocused()<\/b>: void \u2013 \u043c\u0435\u0442\u043e\u0434 \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u0435\u0442 \u0438\u0437\u043c\u0435\u043d\u0438\u0442\u044c \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435 \u043f\u043e\u043b\u044f focused (\u0434\u043e\u0441\u0442\u0443\u043f\u043d\u043e \u0442\u043e\u043b\u044c\u043a\u043e \u0434\u043b\u044f FormControl)
  \u2022 dispose()<\/b>: void \u2013 \u043e\u0431\u044f\u0437\u0430\u0442\u0435\u043b\u0435\u043d \u043a \u0432\u044b\u0437\u043e\u0432\u0443 \u0432 componentWillUnmount \u043a\u043e\u043d\u0442\u0440\u043e\u043b\u0430 \u043e\u0442\u0432\u0435\u0447\u0430\u044e\u0449\u0435\u0433\u043e \u0437\u0430 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0443.<\/p>\n
  \u041f\u0440\u0438\u043c\u0435\u0447\u0430\u043d\u0438\u0435.
  \u041f\u043e\u043b\u044f valid \u0438 invalid \u0432 FormGroup \u0438 FormArray \u043e\u0440\u0438\u0435\u043d\u0442\u0438\u0440\u0443\u0435\u0442\u0441\u044f \u043d\u0430 \u0432\u043b\u043e\u0436\u0435\u043d\u043d\u044b\u0435 \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u044b.
  \u0418 \u043f\u0440\u043e\u0432\u0435\u0440\u0438\u0432 \u0441\u0430\u043c\u044b\u0439 \u0432\u0435\u0440\u0445\u043d\u0438\u0439 \u043c\u043e\u0436\u043d\u043e \u0443\u0437\u043d\u0430\u0442\u044c \u0432\u0430\u043b\u0438\u0434\u043d\u043e\u0441\u0442\u044c \u0432\u0441\u0435\u0445 \u043d\u0438\u0436\u0435\u0441\u0442\u043e\u044f\u0449\u0438\u0445 \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u043e\u0432 \u0444\u043e\u0440\u043c\u044b.
  \u041d\u041e! \u0423\u0437\u043b\u044b FormGroup \u0438 FormArray \u0438\u043c\u0435\u044e\u0442 c\u0432\u043e\u0439<\/b> \u043d\u0430\u0431\u043e\u0440 \u0432\u0430\u043b\u0438\u0434\u0430\u0446\u0438\u0439 \u0438 \u0441\u043f\u0438\u0441\u043e\u043a \u043e\u0448\u0438\u0431\u043e\u043a (errors, warnings, informationMessages, successes). \u0422.\u0435. \u0435\u0441\u043b\u0438 \u0441\u043f\u0440\u043e\u0441\u0438\u0442\u044c \u0443 FormGroup errors \u2013 \u043e\u043d\u0430 \u0432\u044b\u0434\u0430\u0441\u0442 \u0442\u043e\u043b\u044c\u043a\u043e \u0441\u0432\u043e\u0438 \u043e\u0448\u0438\u0431\u043a\u0438, \u043d\u043e \u043d\u0435 \u043e\u0448\u0438\u0431\u043a\u0438 \u043d\u0430 \u0432\u043b\u043e\u0436\u0435\u043d\u043d\u043e\u043c FormControl.<\/p>\n
\u0412\u0430\u043b\u0438\u0434\u0430\u0446\u0438\u0438<\/h2>\n
  \u0411\u0438\u0431\u043b\u0438\u043e\u0442\u0435\u043a\u0430 mobx-form-validation-kit \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u0435\u0442 \u043f\u0438\u0441\u0430\u0442\u044c \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044c\u0441\u043a\u0438\u0435 \u0432\u0430\u043b\u0438\u0434\u0430\u0446\u0438\u0438, \u043d\u043e \u0432 \u043d\u0435\u0439 \u043f\u0440\u0438\u0441\u0443\u0442\u0441\u0442\u0432\u0443\u0435\u0442 \u0438 \u0441\u043e\u0431\u0441\u0442\u0432\u0435\u043d\u043d\u044b\u0439 \u043d\u0430\u0431\u043e\u0440.
  \u2022 requiredValidator<\/b> \u2013 \u043f\u0440\u043e\u0432\u0435\u0440\u044f\u0442, \u0447\u0442\u043e \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435 \u043d\u0435 \u0440\u0430\u0432\u043d\u043e null, \u0430 \u0434\u043b\u044f \u0441\u0442\u0440\u043e\u043a \u043f\u0440\u043e\u0432\u0435\u0440\u044f\u0442 \u0441\u0442\u0440\u043e\u043a\u0443 \u043d\u0430 \u043f\u0443\u0441\u0442\u043e\u0442\u0443.
  \u2022 notEmptyOrSpacesValidator<\/b> \u2013 \u043f\u0440\u043e\u0432\u0435\u0440\u044f\u0435\u0442, \u0447\u0442\u043e \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435 \u043d\u0435 \u0440\u0430\u0432\u043d\u043e null, \u0430 \u0434\u043b\u044f \u0441\u0442\u0440\u043e\u043a \u043f\u0440\u043e\u0432\u0435\u0440\u044f\u0435\u0442 \u0441\u0442\u0440\u043e\u043a\u0443 \u043d\u0430 \u043f\u0443\u0441\u0442\u043e\u0442\u0443 \u0438\u043b\u0438 \u0447\u0442\u043e \u043e\u043d\u0430 \u043d\u0435 \u0441\u043e\u0441\u0442\u043e\u0438\u0442 \u0438\u0437 \u043e\u0434\u043d\u0438\u0445 \u043f\u0440\u043e\u0431\u0435\u043b\u043e\u0432.
  \u2022 notContainSpacesValidator<\/b> \u2014 \u043f\u0440\u043e\u0432\u0435\u0440\u044f\u0435\u0442, \u0447\u0442\u043e \u0441\u0442\u0440\u043e\u043a\u0430 \u043d\u0435 \u0441\u043e\u0434\u0435\u0440\u0436\u0438\u0442 \u043f\u0440\u043e\u0431\u0435\u043b\u043e\u0432.
  \u2022 patternValidator<\/b> \u2013 \u0432\u044b\u0434\u0430\u0435\u0442 \u043e\u0448\u0438\u0431\u043a\u0443, \u0435\u0441\u043b\u0438 \u043d\u0435\u0442 \u0441\u043e\u043e\u0442\u0432\u0435\u0442\u0441\u0442\u0432\u0438\u044f \u043f\u0430\u0442\u0442\u0435\u0440\u043d\u0443
  \u2022 invertPatternValidator<\/b> \u2014 \u0432\u044b\u0434\u0430\u0435\u0442 \u043e\u0448\u0438\u0431\u043a\u0443, \u0435\u0441\u043b\u0438 \u0435\u0441\u0442\u044c \u0441\u043e\u043e\u0442\u0432\u0435\u0442\u0441\u0442\u0432\u0438\u0435 \u043f\u0430\u0442\u0442\u0435\u0440\u043d\u0443
  \u2022 minLengthValidator<\/b> \u2013 \u043f\u0440\u043e\u0432\u0435\u0440\u044f\u0435\u0442 \u0441\u0442\u0440\u043e\u043a\u0443 \u043d\u0430 \u043c\u0438\u043d\u0438\u043c\u0430\u043b\u044c\u043d\u0443\u044e \u0434\u043b\u0438\u043d\u0443
  \u2022 maxLengthValidator<\/b> \u2013 \u043f\u0440\u043e\u0432\u0435\u0440\u044f\u0435\u0442 \u0441\u0442\u0440\u043e\u043a\u0443 \u043d\u0430 \u043c\u0430\u043a\u0441\u0438\u043c\u0430\u043b\u044c\u043d\u0443\u044e \u0434\u043b\u0438\u043d\u0443
  \u2022 absoluteLengthValidator<\/b> \u2013 \u043f\u0440\u043e\u0432\u0435\u0440\u044f\u0435\u0442 \u0441\u0442\u0440\u043e\u043a\u0443 \u043d\u0430 \u043a\u043e\u043d\u043a\u0440\u0435\u0442\u043d\u0443\u044e \u0434\u043b\u0438\u043d\u0443
  \u2022 isEqualValidator<\/b> \u2013 \u043f\u0440\u043e\u0432\u0435\u0440\u044f\u0435\u0442 \u043d\u0430 \u0442\u043e\u0447\u043d\u043e\u0435 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435
  \u2022 compareValidator<\/b> \u2014 \u043e\u0431\u0451\u0440\u0442\u043a\u0430 \u0434\u043b\u044f \u0441\u043b\u043e\u0436\u043d\u043e\u0439 \u043f\u0440\u043e\u0432\u0435\u0440\u043a\u0438 (\u043e\u0448\u0438\u0431\u043a\u0430, \u0435\u0441\u043b\u0438 \u043f\u0440\u043e\u0432\u0435\u0440\u043a\u0430 \u0432\u0435\u0440\u043d\u0443\u043b\u0430 false)
  \u0412\u0435\u0440\u043d\u0435\u043c\u0441\u044f \u043a \u043d\u0430\u0448\u0435\u043c\u0443 \u043f\u0440\u0438\u043c\u0435\u0440\u0443 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u044b \u0440\u0435\u0433\u0438\u0441\u0442\u0440\u0430\u0446\u0438\u0438.  <\/p>\n
\n
  TypeScript<\/b>  <\/p>\n
   this.form = new FormGroup<FormRegistration>({       firstName: new FormControl<string>("", {         validators: [requiredValidator()],       }),       lastName: new FormControl<string>("", {         validators: [requiredValidator()],       }),       email: new FormControl<string>("", {         validators: [requiredValidator()],       }),       age: new FormControl<string>(""),     }); <\/code><\/pre>\n
  \u0421\u0435\u0439\u0447\u0430\u0441 firstName \u043f\u0440\u043e\u0432\u0435\u0440\u044f\u0435\u0442\u0441\u044f \u0442\u043e\u043b\u044c\u043a\u043e \u043d\u0430 \u043f\u0440\u0438\u0441\u0443\u0442\u0441\u0442\u0432\u0438\u0435, \u0434\u0430\u0432\u0430\u0439\u0442\u0435 \u043e\u0433\u0440\u0430\u043d\u0438\u0447\u0438\u043c \u0435\u0433\u043e \u0434\u043b\u0438\u043d\u0443 \u0438 \u0441\u043a\u0430\u0436\u0435\u043c \u0447\u0442\u043e \u043f\u043e\u043b\u0435 \u043d\u0435 \u0434\u043e\u043b\u0436\u043d\u043e \u0441\u043e\u0434\u0435\u0440\u0436\u0430\u0442\u044c \u043f\u0440\u043e\u0431\u0435\u043b\u044b.  <\/p>\n
       firstName: new FormControl<string>("", {         validators: [           requiredValidator(),           minLengthValidator(2),           maxLengthValidator(5),           notContainSpacesValidator()         ],       }), <\/code><\/pre>\n
  \u0421\u043e\u0431\u0441\u0442\u0432\u0435\u043d\u043d\u043e, \u043e\u0442\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u0435 \u0432\u0430\u043b\u0438\u0434\u0430\u0446\u0438\u0439 \u0431\u0443\u0434\u0435\u0442 \u0442\u0430\u043a\u0438\u043c. 
    <\/p>\n
\n
  Flutter<\/b>  <\/p>\n
 this.form = FormGroup(RegistrationForm(       firstName: FormControl(           value: "",           options: OptionsFormControl(validators: [             requiredValidator(),             minLengthValidator(2),             maxLengthValidator(5),             notContainSpacesValidator()           ])),       lastName: FormControl(           value: "",           options: OptionsFormControl(validators: [requiredValidator()])),       email: FormControl(           value: "",           options: OptionsFormControl(validators: [requiredValidator()])),       age: FormControl(           value: "",           options: OptionsFormControl(validators: [requiredValidator()])),     )); <\/code><\/pre>\n
  \u0421\u0435\u0439\u0447\u0430\u0441 firstName \u043f\u0440\u043e\u0432\u0435\u0440\u044f\u0435\u0442\u0441\u044f \u0442\u043e\u043b\u044c\u043a\u043e \u043d\u0430 \u043f\u0440\u0438\u0441\u0443\u0442\u0441\u0442\u0432\u0438\u0435, \u0434\u0430\u0432\u0430\u0439\u0442\u0435 \u043e\u0433\u0440\u0430\u043d\u0438\u0447\u0438\u043c \u0435\u0433\u043e \u0434\u043b\u0438\u043d\u0443 \u0438 \u0441\u043a\u0430\u0436\u0435\u043c \u0447\u0442\u043e \u043f\u043e\u043b\u0435 \u043d\u0435 \u0434\u043e\u043b\u0436\u043d\u043e \u0441\u043e\u0434\u0435\u0440\u0436\u0430\u0442\u044c \u043f\u0440\u043e\u0431\u0435\u043b\u044b.  <\/p>\n
 options: OptionsFormControl(validators: [             requiredValidator(),             minLengthValidator(2),             maxLengthValidator(5),             notContainSpacesValidator()           ]) <\/code><\/pre>\n
  \u0421\u043e\u0431\u0441\u0442\u0432\u0435\u043d\u043d\u043e, \u043e\u0442\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u0435 \u0432\u0430\u043b\u0438\u0434\u0430\u0446\u0438\u0439 \u0431\u0443\u0434\u0435\u0442 \u0442\u0430\u043a\u0438\u043c. 
  
  ^^^^^^^  <\/p>\n
\n
  \u041a\u0430\u043a \u043c\u043e\u0436\u043d\u043e \u0437\u0430\u043c\u0435\u0442\u0438\u0442\u044c \u043e\u0442\u0440\u0430\u0431\u043e\u0442\u0430\u043b\u0438 \u0432\u0441\u0435 \u0432\u0430\u043b\u0438\u0434\u0430\u0446\u0438\u0438 \u0432 \u0441\u043f\u0438\u0441\u043a\u0435. \u041d\u043e \u0447\u0430\u0441\u0442\u043e \u0431\u044b\u0432\u0430\u0435\u0442, \u0447\u0442\u043e \u0437\u0430\u043a\u0430\u0437\u0447\u0438\u043a \u0445\u043e\u0447\u0435\u0442 \u0443\u0432\u0438\u0434\u0435\u0442\u044c \u043b\u0438\u0448\u044c \u043e\u0434\u043d\u0443 \u043e\u0448\u0438\u0431\u043a\u0443, \u0430 \u043d\u0435 \u0432\u0441\u0435 \u0441\u0440\u0430\u0437\u0443. \u0411\u043e\u043b\u0435\u0435 \u0442\u043e\u0433\u043e, \u0422\u0417 \u043c\u043e\u0436\u0435\u0442 \u0431\u044b\u0442\u044c \u0441\u043e\u0441\u0442\u0430\u0432\u043b\u0435\u043d\u043e \u0442\u0430\u043a, \u0447\u0442\u043e \u043e\u0434\u043d\u0430 \u043f\u0440\u043e\u0432\u0435\u0440\u043a\u0430 \u0432\u044b\u043f\u043e\u043b\u043d\u044f\u0435\u0442\u0441\u044f \u0442\u043e\u043b\u044c\u043a\u043e \u043f\u043e\u0441\u043b\u0435 \u0442\u043e\u0433\u043e \u043a\u0430\u043a \u043f\u0440\u043e\u0448\u043b\u0430 \u043f\u0440\u0435\u0434\u044b\u0434\u0443\u0449\u0430\u044f.
  \u0414\u043b\u044f \u0440\u0435\u0448\u0435\u043d\u0438\u044f \u0434\u0430\u043d\u043d\u043e\u0439 \u043f\u0440\u043e\u0431\u043b\u0435\u043c\u044b \u043f\u0440\u0438\u043c\u0435\u043d\u044f\u0435\u0442\u0441\u044f \u043e\u0431\u0435\u0440\u0442\u043a\u0430 wrapperSequentialCheck<\/b>. \u0415\u0451 \u0432\u044b\u0437\u043e\u0432 \u0438 \u0435\u0451 \u043f\u0440\u0438\u043c\u0435\u043d\u0435\u043d\u0438\u0435 \u043d\u0438\u0447\u0435\u043c \u043d\u0435 \u043e\u0442\u043b\u0438\u0447\u0430\u0435\u0442\u0441\u044f \u043e\u0442 \u043e\u0431\u044b\u0447\u043d\u043e\u0439 \u0444\u0443\u043d\u043a\u0446\u0438\u0438-\u0432\u0430\u043b\u0438\u0434\u0430\u0442\u043e\u0440\u0430, \u043d\u043e \u043d\u0430 \u0432\u0445\u043e\u0434 \u043e\u043d\u0430 \u043f\u0440\u0438\u043d\u0438\u043c\u0430\u0435\u0442 \u043c\u0430\u0441\u0441\u0438\u0432 \u0438\u0437 \u0432\u0430\u043b\u0438\u0434\u0430\u0442\u043e\u0440\u043e\u0432 \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u0431\u0443\u0434\u0435\u0442 \u0437\u0430\u043f\u0443\u0441\u043a\u0430\u0442\u044c\u0441\u044f \u043f\u043e\u0441\u043b\u0435\u0434\u043e\u0432\u0430\u0442\u0435\u043b\u044c\u043d\u043e, \u0442.\u0435. \u0441\u043b\u0435\u0434\u0443\u044e\u0449\u0430\u044f \u0432\u0430\u043b\u0438\u0434\u0430\u0446\u0438\u044f \u0437\u0430\u043f\u0443\u0441\u0442\u0438\u0442\u0441\u044f \u0442\u043e\u043b\u044c\u043a\u043e \u043f\u043e\u0441\u043b\u0435 \u0442\u043e\u0433\u043e, \u043a\u0430\u043a \u043f\u0440\u0435\u0434\u044b\u0434\u0443\u0449\u0430\u044f \u043f\u0440\u043e\u0448\u043b\u0430 \u0431\u0435\u0437 \u043e\u0448\u0438\u0431\u043e\u043a.
  \u0412\u0442\u043e\u0440\u043e\u0439 \u0444\u0443\u043d\u043a\u0446\u0438\u0439 \u043e\u0431\u0435\u0440\u0442\u043a\u043e\u0439 \u044f\u0432\u043b\u044f\u0435\u0442\u0441\u044f \u0444\u0443\u043d\u043a\u0446\u0438\u044f \u0443\u043f\u0440\u0430\u0432\u043b\u0435\u043d\u0438\u044f \u043f\u043e\u0442\u043e\u043a\u043e\u043c \u0432\u0430\u043b\u0438\u0434\u0430\u0446\u0438\u0439. wrapperActivateValidation<\/b> \u043f\u0435\u0440\u0432\u044b\u043c \u043f\u0430\u0440\u0430\u043c\u0435\u0442\u0440\u043e\u043c \u043f\u0440\u0438\u043d\u0438\u043c\u0430\u0435\u0442 \u0444\u0443\u043d\u043a\u0446\u0438\u044e \u0432 \u043a\u043e\u0442\u043e\u0440\u043e\u0439 \u043d\u0443\u0436\u043d\u043e \u043f\u0440\u043e\u043f\u0438\u0441\u0430\u0442\u044c \u0443\u0441\u043b\u043e\u0432\u0438\u044f \u0430\u043a\u0442\u0438\u0432\u0430\u0446\u0438\u0439 \u0432\u0430\u043b\u0438\u0434\u0430\u0446\u0438\u0439. \u0412 \u043e\u0442\u043b\u0438\u0447\u0438\u0438 \u043e\u0442 \u0444\u0443\u043d\u043a\u0446\u0438\u0438 activate \u043a\u043e\u0442\u043e\u0440\u0430\u044f \u043f\u0435\u0440\u0435\u0434\u0430\u0435\u0442\u0441\u044f \u0432 FormControl \u0434\u0430\u043d\u043d\u0430\u044f \u043f\u0440\u043e\u0432\u0435\u0440\u043a\u0430 \u0440\u0430\u0441\u0441\u0447\u0438\u0442\u0430\u043d\u0430 \u043d\u0430 \u0431\u043e\u043b\u0435\u0435 \u0441\u043b\u043e\u0436\u043d\u0443\u044e \u043b\u043e\u0433\u0438\u043a\u0443. \u041f\u0440\u0435\u0434\u043f\u043e\u043b\u043e\u0436\u0438\u043c, \u0447\u0442\u043e \u0443 \u043d\u0430\u0441 \u043e\u0431\u0449\u0438\u0439 \u0431\u0438\u043b\u0434\u0435\u0440 \u0434\u043b\u044f \u0446\u0435\u043b\u043e\u0439 \u0444\u043e\u0440\u043c\u044b FormGroup \u043f\u043b\u0430\u0442\u0435\u0436\u0435\u0439, \u0438 \u0431\u043e\u043b\u0435\u0435 \u0442\u043e\u0433\u043e \u043d\u0430 \u0441\u0435\u0440\u0432\u0435\u0440\u0435 \u0435\u0441\u0442\u044c \u0442\u043e\u043b\u044c\u043a\u043e \u043e\u0434\u0438\u043d \u043c\u0435\u0442\u043e\u0434 \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u0438 \u043f\u0440\u0438\u043d\u0438\u043c\u0430\u0435\u0442 \u043e\u0431\u0449\u0438\u0439 \u043d\u0430\u0431\u043e\u0440 \u043f\u043e\u043b\u0435\u0439. \u041d\u043e \u0432\u043e\u0442 \u0437\u0430\u0433\u0432\u043e\u0437\u0434\u043a\u0430 \u0432 \u0442\u043e\u043c, \u0447\u0442\u043e \u0445\u043e\u0442\u044c \u0444\u043e\u0440\u043c\u0430 \u0438 \u043e\u0434\u043d\u0430, \u0432 \u0437\u0430\u0432\u0438\u0441\u0438\u043c\u043e\u0441\u0442\u0438 \u043e\u0442 \u00ab\u0442\u0438\u043f\u0430 \u043f\u043b\u0430\u0442\u0435\u0436\u0430\u00bb \u043c\u044b \u043f\u043e\u043a\u0430\u0437\u044b\u0432\u0430\u0435\u043c \u0440\u0430\u0437\u043b\u0438\u0447\u043d\u044b\u0439 \u043d\u0430\u0431\u043e\u0440 \u043f\u043e\u043b\u0435\u0439 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044e. \u0422\u0430\u043a \u0432\u043e\u0442 wrapperActivateValidation<\/b> \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u0435\u0442 \u043d\u0430\u043f\u0438\u0441\u0430\u0442\u044c \u043b\u043e\u0433\u0438\u043a\u0443 \u043f\u0440\u0438 \u043a\u043e\u0442\u043e\u0440\u043e\u0439 \u0431\u0443\u0434\u0443\u0442 \u043e\u0441\u0443\u0449\u0435\u0441\u0442\u0432\u043b\u044f\u0442\u044c\u0441\u044f \u0440\u0430\u0437\u043b\u0438\u0447\u043d\u044b\u0435 \u043f\u0440\u043e\u0432\u0435\u0440\u043a\u0438 \u0432 \u0437\u0430\u0432\u0438\u0441\u0438\u043c\u043e\u0441\u0442\u0438 \u043e\u0442 \u0442\u0438\u043f\u0430 \u043f\u043b\u0430\u0442\u0435\u0436\u0430.<\/p>\n
\n
  TypeScript<\/b>  <\/p>\n
 firstName: new FormControl<string>("", {         validators: [           wrapperSequentialCheck([             requiredValidator(),             minLengthValidator(2),             maxLengthValidator(5),             notContainSpacesValidator(),           ]),         ],       }),<\/code><\/pre>\n
  <\/p>\n
\n
  Flutter<\/b>  <\/p>\n
firstName: FormControl(           value: "",           options: OptionsFormControl(validators: [             wrapperSequentialCheck([               requiredValidator(),               minLengthValidator(2),               maxLengthValidator(5),               notContainSpacesValidator()             ])           ])) <\/code><\/pre>\n
  ^^^^^^^  <\/p>\n
\n
  \u0412 \u043e\u0431\u0449\u0435\u043c \u0438 \u0446\u0435\u043b\u043e\u043c \u043c\u044b \u043b\u0435\u0433\u043a\u043e \u043c\u043e\u0436\u0435\u043c \u043c\u0435\u043d\u044f\u0442\u044c \u043d\u0430\u0431\u043e\u0440 \u0432\u0430\u043b\u0438\u0434\u0430\u0446\u0438\u0439 \u0432 \u043e\u0434\u043d\u043e\u043c \u043a\u043e\u043d\u043a\u0440\u0435\u0442\u043d\u043e\u043c \u043c\u0435\u0441\u0442\u0435. \u0418 \u043d\u0430\u043c \u0434\u0430\u0436\u0435 \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u0435\u043d\u0438\u0435 \u043d\u0435 \u043d\u0443\u0436\u043d\u043e, \u0447\u0442\u043e\u0431\u044b \u043f\u043e\u043d\u044f\u0442\u044c, \u0447\u0442\u043e \u043e\u0442\u043a\u0443\u0434\u0430 \u0438 \u043a\u0443\u0434\u0430 \u0438\u0434\u0435\u0442.
  \u0411\u043e\u043b\u0435\u0435 \u0442\u043e\u0433\u043e, \u043d\u0430\u043f\u0438\u0441\u0430\u043d\u0438\u0435 \u0441\u0432\u043e\u0435\u0439 \u0444\u0443\u043d\u043a\u0446\u0438\u0438 \u0432\u0430\u043b\u0438\u0434\u0430\u0442\u043e\u0440\u0430 \u043d\u0435 \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u044f\u0435\u0442 \u0431\u043e\u043b\u044c\u0448\u043e\u0439 \u0441\u043b\u043e\u0436\u043d\u043e\u0441\u0442\u0438.
  \u0414\u0430\u0432\u0430\u0439\u0442\u0435 \u0440\u0430\u0437\u0431\u0435\u0440\u0435\u043c \u0435\u0433\u043e \u043d\u0430 \u043f\u0440\u0438\u043c\u0435\u0440\u0435 \u0432\u0430\u043b\u0438\u0434\u0430\u0446\u0438\u0438 \u0433\u0440\u0443\u043f\u043f\u044b \u0434\u043b\u044f \u043f\u0435\u0440\u0438\u043e\u0434\u0430 \u0434\u0430\u0442.  <\/p>\n
\n
  TypeScript<\/b>  <\/p>\n
interface FormRange extends ControlsCollection {   min: FormControl<Date>;   max: FormControl<Date>; }  interface FormRegistration extends ControlsCollection {   firstName: FormControl<string>;   lastName: FormControl<string>;   email: FormControl<string>;   age: FormControl<string>;   dateRange: FormGroup<FormRange>; } <\/code><\/pre>\n
this.form = new FormGroup<FormRegistration>({ \u2026       dateRange: new FormGroup<FormRange>(         {           min: new FormControl<Date>(new Date()),           max: new FormControl<Date>(new Date()),         },         {           validators: [             async (group: FormGroup<FormRange>): Promise<ValidationEvent[]> => { if (group.controls.max.value < group.controls.min.value) {                 return [                   {                     message: '\u0414\u0430\u0442\u0430 "\u043e\u0442" \u0431\u043e\u043b\u044c\u0448\u0435 \u0434\u0430\u0442\u044b "\u0434\u043e"',                     type: ValidationEventTypes.Error,                   },                 ];               }               return [];            },           ],         }       ),     }); <\/code><\/pre>\n
  <\/p>\n
\n
  Flutter<\/b>  <\/p>\n
 class FormRange extends ControlsCollection {   final FormControl<DateTime> min;   final FormControl<DateTime> max;   FormRange({this.min, this.max});   @override   Iterable<AbstractControl> allFields() => [this.min, this.max]; }  class RegistrationForm extends ControlsCollection { \u2026   RegistrationForm(       {this.firstName, this.lastName, this.email, this.age, this.dateRange});    @override   Iterable<AbstractControl> allFields() =>       [this.firstName, this.lastName, this.email, this.age, this.dateRange]; } <\/code><\/pre>\n
this.form = FormGroup(RegistrationForm( \u2026       dateRange: FormGroup<FormRange>(           FormRange(               min: FormControl<DateTime>(value: DateTime.now()),               max: FormControl<DateTime>(value: DateTime.now())),           options: OptionsFormGroup<FormRange>(validators: [             (FormGroup<FormRange> group) async {               if (group.controls.max.value.isBefore(group.controls.min.value)) {                 return [                   ValidationEvent(                     message: '\u0414\u0430\u0442\u0430 "\u043e\u0442" \u0431\u043e\u043b\u044c\u0448\u0435 \u0434\u0430\u0442\u044b "\u0434\u043e"',                     type: ValidationEventTypes.Error,                   )                 ];               }               return [];             },           ])),     ));<\/code><\/pre>\n
  \u0422\u0443\u0442 \u043d\u0443\u0436\u043d\u043e \u0431\u044b\u0442\u044c \u0430\u043a\u043a\u0443\u0440\u0430\u0442\u043d\u044b\u043c \u0441 \u0442\u0438\u043f\u0430\u043c\u0438. Flutter \u0445\u043b\u0435\u0431\u043e\u043c \u043d\u0435 \u043a\u043e\u0440\u043c\u0438, \u043d\u043e \u0434\u0430\u0439 \u043d\u0430\u043f\u0438\u0441\u0430\u0442\u044c \u0432 \u043e\u0448\u0438\u0431\u043a\u0443, \u0447\u0442\u043e subtype \u043d\u0435\u043f\u0440\u0430\u0432\u0438\u043b\u044c\u043d\u044b\u0439\u2026
  ^^^^^^^  <\/p>\n
\n
  \u041a\u0430\u043a \u0432\u0438\u0434\u043d\u043e \u0438\u0437 \u043f\u0440\u0438\u043c\u0435\u0440\u0430 \u0432\u0430\u043b\u0438\u0434\u0430\u0446\u0438\u044f \u0432\u0435\u0448\u0430\u0435\u0442\u0441\u044f \u043d\u0435 \u043d\u0430 \u043a\u043e\u043d\u043a\u0440\u0435\u0442\u043d\u043e\u0435 \u043f\u043e\u043b\u0435 [\u0445\u043e\u0442\u044f \u0442\u0430\u043a \u0442\u043e\u0436\u0435 \u043c\u043e\u0436\u043d\u043e], \u0430 \u0432\u0435\u0448\u0430\u0435\u0442\u0441\u044f \u043d\u0430 \u0432\u0441\u044e \u0433\u0440\u0443\u043f\u043f\u0443 \u0446\u0435\u043b\u0438\u043a\u043e\u043c. \u041e\u0441\u0442\u0430\u0435\u0442\u0441\u044f \u043b\u0438\u0448\u044c \u0432\u044b\u0432\u0435\u0441\u0442\u0438 \u043e\u0448\u0438\u0431\u043a\u0438 \u0433\u0440\u0443\u043f\u043f\u044b \u0432 \u0438\u043d\u0442\u0435\u0440\u0444\u0435\u0439\u0441\u0435.<\/p>\n
\u041a\u043d\u043e\u043f\u043a\u0430 \u00abSubmit\u00bb<\/h2>\n
  \u0423\u0441\u0442\u0430\u043b\u0438? \ud83d\ude42 \u0414\u0430, \u044f \u0442\u043e\u0436\u0435\u2026 \u0423\u0436\u0435 \u0438\u0434\u0435\u0442 20-\u044f \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0430 \u0442\u0435\u043a\u0441\u0442\u0430 \u0438 \u0435\u0449\u0435 \u043c\u043d\u043e\u0433\u043e \u0435\u0441\u0442\u044c \u043e \u0447\u0435\u043c \u043c\u043e\u0436\u043d\u043e \u0440\u0430\u0441\u0441\u043a\u0430\u0437\u0430\u0442\u044c \u0438\u043b\u0438 \u0440\u0430\u0441\u0441\u043c\u043e\u0442\u0440\u0435\u0442\u044c \u043a\u043e\u043d\u043a\u0440\u0435\u0442\u043d\u044b\u0435 \u043f\u0440\u0438\u043c\u0435\u0440\u044b.
  \u041d\u043e \u0434\u0430\u0432\u0430\u0439\u0442\u0435 \u043e\u0441\u0438\u043b\u0438\u043c, \u043b\u0438\u0448\u044c \u0435\u0449\u0435 \u043e\u0434\u0438\u043d \u043c\u043e\u043c\u0435\u043d\u0442, \u0447\u0442\u043e \u0434\u0435\u043b\u0430\u0442\u044c, \u0435\u0441\u043b\u0438 \u043d\u0430\u0436\u0430\u0442\u044c \u043d\u0430 \u043a\u043d\u043e\u043f\u043a\u0443 \u00ab\u041e\u0442\u043f\u0440\u0430\u0432\u0438\u0442\u044c\u00bb
  \u041d\u0430\u0438\u0431\u043e\u043b\u0435\u0435 \u043f\u043e\u043f\u0443\u043b\u044f\u0440\u043d\u044b\u0439 \u0432\u0430\u0440\u0438\u0430\u043d\u0442 \u0434\u0435\u0439\u0441\u0442\u0432\u0438\u044f, \u043f\u043e \u043a\u043d\u043e\u043f\u043a\u0435 \u043e\u043f\u0440\u0430\u0432\u0438\u0442\u044c \u2013 \u043f\u043e\u043a\u0430\u0437\u0430\u0442\u044c \u0432\u0441\u0435 \u043e\u0448\u0438\u0431\u043e\u0447\u043d\u044b\u0435 \u043f\u043e\u043b\u044f \u0438 \u0432 \u0438\u0434\u0435\u0430\u043b\u0435 \u043f\u043e\u0441\u0442\u0430\u0432\u0438\u0442\u044c \u043f\u043e\u043b\u0435 \u043d\u0430 \u0444\u043e\u043a\u0443\u0441.  <\/p>\n
\n
  TypeScript<\/b>  <\/p>\n
\u2026 await this.form.wait();  if (this.form.invalid) {  this.form.setTouched(true);   const firstError = this.form.allControls().find(c => c.invalid && !!c.element);  if (!!firstError) {     firstError.element.focus();   }  \u2026 } <\/code><\/pre>\n
  <\/p>\n
\n
  Flutter<\/b>  <\/p>\n
\u2026 await this.form.wait();     if (this.form.invalid) {       this.form.setTouched(true);       final firstError = this.form.allControls().firstWhere((c) => c.invalid);       firstError.focusNode.requestFocus();     } \u2026 <\/code><\/pre>\n
  ^^^^^^^  <\/p>\n
\n
  \u041e\u0441\u043d\u043e\u0432\u043d\u043e\u0439 \u043c\u043e\u043c\u0435\u043d\u0442 \u0437\u0434\u0435\u0441\u044c, \u044d\u0442\u043e \u0434\u043e\u0436\u0434\u0430\u0442\u044c\u0441\u044f \u043e\u043a\u043e\u043d\u0447\u0430\u043d\u0438\u044f \u0440\u0430\u0431\u043e\u0442\u044b \u0432\u0441\u0435\u0445 \u0432\u0430\u043b\u0438\u0434\u0430\u0446\u0438\u0439.
  await this.form.wait();<\/i>
  \u0414\u0430\u043b\u044c\u0448\u0435 \u043c\u044b \u043f\u0440\u043e\u0432\u0435\u0440\u044f\u0435\u043c \u0441\u043e\u0441\u0442\u043e\u044f\u043d\u0438\u0435 \u043d\u0430\u0438\u0431\u043e\u043b\u0435\u0435 \u043e\u0431\u0449\u0435\u0439 \u0433\u0440\u0443\u043f\u043f\u044b \u043d\u0430 \u0432\u0430\u043b\u0438\u0434\u043d\u043e\u0441\u0442\u044c, \u0430 \u043f\u043e\u0441\u043b\u0435 \u0435\u0449\u0435 \u0438 \u043a\u0443\u0440\u0441\u043e\u0440 \u0441\u0442\u0430\u0432\u0438\u043c \u043d\u0430 \u043a\u043e\u043d\u043a\u0440\u0435\u0442\u043d\u043e\u0435 \u043c\u0435\u0441\u0442\u043e.
  \u0418 \u043e\u043f\u044f\u0442\u044c \u0436\u0435 \u043a\u0430\u043a \u043c\u043e\u0436\u043d\u043e \u0432\u0438\u0434\u0435\u0442\u044c, \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u0435\u043d\u0438\u0435 \u043d\u0435 \u0442\u0440\u043e\u0433\u0430\u0435\u0442\u0441\u044f, \u0432\u0441\u044f \u043b\u043e\u0433\u0438\u043a\u0430 \u043f\u0438\u0448\u0435\u0442\u0441\u044f \u0432 Store, \u0430 \u043a\u0430\u043a \u0441\u043b\u0435\u0434\u0441\u0442\u0432\u0438\u0435 \u0432\u0438\u0437\u0443\u0430\u043b\u0438\u0437\u0438\u0440\u043e\u0432\u0430\u0442\u044c \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0443 \u0438 \u043f\u0438\u0441\u0430\u0442\u044c \u043b\u043e\u0433\u0438\u043a\u0443 \u043f\u0440\u043e\u0432\u0435\u0440\u043a\u0438 \u043c\u043e\u0433\u0443\u0442 \u0441\u043e\u0432\u0435\u0440\u0448\u0435\u043d\u043d\u043e \u0440\u0430\u0437\u043d\u044b\u0435 \u043b\u044e\u0434\u0438. \u0418 \u0432 \u0440\u0435\u0436\u0438\u043c\u0435 \u043a\u0440\u0430\u043d\u0447\u0430 \u2013 \u044d\u0442\u043e \u043f\u043e\u0437\u0432\u043e\u043b\u0438\u0442 \u0441\u044d\u043a\u043e\u043d\u043e\u043c\u0438\u0442\u044c \u0432\u0440\u0435\u043c\u044f.<\/p>\n
\u0417\u0430\u043a\u043b\u044e\u0447\u0435\u043d\u0438\u0435<\/h2>\n
  \u041f\u043e\u043d\u044f\u0442\u043d\u043e\u0435 \u0434\u0435\u043b\u043e, \u0447\u0442\u043e \u043e\u043f\u0438\u0441\u0430\u043d\u043d\u044b\u043c \u043d\u0430\u0431\u043e\u0440 \u0432\u043e\u0437\u043c\u043e\u0436\u043d\u043e\u0441\u0442\u0435\u0439 \u0431\u0438\u0431\u043b\u0438\u043e\u0442\u0435\u043a\u0438 \u043d\u0435 \u043e\u0433\u0440\u0430\u043d\u0438\u0447\u0438\u0432\u0430\u0435\u0442\u0441\u044f. \u0415\u0449\u0435 \u043c\u043e\u0436\u043d\u043e \u0440\u0430\u0441\u0441\u043a\u0430\u0437\u0430\u0442\u044c \u0438 \u043f\u043e\u043a\u0430\u0437\u0430\u0442\u044c \u043f\u0440\u0438\u043c\u0435\u0440\u044b.
  \u2022 \u0427\u0442\u043e \u0432\u0430\u043b\u0438\u0434\u0430\u0446\u0438 \u043e\u0442\u0440\u0430\u0431\u043e\u0442\u0430\u044e\u0442 \u043d\u0435 \u0442\u043e\u043b\u044c\u043a\u043e \u043a\u043e\u0433\u0434\u0430 \u043c\u0435\u043d\u044f\u0435\u0442\u0441\u044f \u0441\u0430\u043c\u043e \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435, \u043d\u043e \u0438 \u043a\u043e\u0433\u0434\u0430 \u043f\u043e\u043c\u0435\u043d\u044f\u043b\u0430\u0441\u044c observable \u043f\u0435\u0440\u0435\u043c\u0435\u043d\u043d\u0430\u044f \u0432\u043d\u0443\u0442\u0440\u0438 \u0432\u0430\u043b\u0438\u0434\u0430\u0446\u0438\u0438.
  \u2022 \u041a\u0430\u043a \u0440\u0430\u0431\u043e\u0442\u0430\u0435\u0442 \u043c\u0435\u0442\u043e\u0434 active
  \u2022 \u0427\u0442\u043e FormControl \u043c\u043e\u0436\u043d\u043e \u0438\u043d\u0438\u0446\u0438\u0430\u043b\u0438\u0437\u043e\u0432\u0430\u0442\u044c \u043d\u0435 \u0442\u043e\u043b\u044c\u043a\u043e \u043a\u043e\u043d\u043a\u0440\u0435\u0442\u043d\u043e\u0439 \u043f\u0435\u0440\u0435\u043c\u0435\u043d\u043d\u043e\u0439, \u043d\u043e \u0438 \u0444\u0443\u043d\u043a\u0446\u0438\u0435\u0439 \u043a\u043e\u0442\u043e\u0440\u0430\u044f \u0432\u043e\u0437\u0432\u0440\u0430\u0449\u0430\u0435\u0442 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435. \u0418 \u0438\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u044f \u0432\u043d\u0443\u0442\u0440\u0438 \u044d\u0442\u043e\u0439 \u0444\u0443\u043d\u043a\u0446\u0438\u0438 \u0431\u0443\u0434\u0443\u0442 \u0442\u0430\u043a\u0436\u0435 \u043e\u0442\u0441\u043b\u0435\u0436\u0438\u0432\u0430\u0442\u044c\u0441\u044f.
  \u2022 \u041a\u0430\u043a \u0440\u0430\u0431\u043e\u0442\u0430\u0442\u044c \u0441 FormArray
  \u2022 \u041a\u0430\u043a \u0434\u0435\u043b\u0430\u0442\u044c \u0441\u043b\u043e\u0436\u043d\u0443\u044e \u0432\u0430\u043b\u0438\u0434\u0430\u0446\u0438\u044e \u0441 \u0437\u0430\u043f\u0440\u043e\u0441\u0430\u043c\u0438 \u043d\u0430 \u0441\u0435\u0440\u0432\u0435\u0440 \u0438 \u043f\u0440\u0438 \u044d\u0442\u043e\u043c \u0432\u0441\u0451 \u0440\u0430\u0432\u043d\u043e observable \u043f\u0435\u0440\u0435\u043c\u0435\u043d\u043d\u044b\u0435 \u0432 \u044d\u0442\u043e\u0439 \u0432\u0430\u043b\u0438\u0434\u0430\u0446\u0438\u0438 \u0431\u0443\u0434\u0443\u0442 \u043e\u0442\u0441\u043b\u0435\u0436\u0438\u0432\u0430\u0435\u043c\u044b\u043c\u0438.
  \u0418 \u0435\u0449\u0435 \u043a\u0443\u0447\u0443 \u0432\u0441\u0435\u0433\u043e, \u0447\u0442\u043e \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u0435\u0442 \u0438\u0437 \u043a\u043e\u0440\u043e\u0431\u043a\u0438 \u043f\u0430\u043a\u0435\u0442 mobx-form-validation-kit.
  \u041d\u0430\u0434\u0435\u044e\u0441\u044c \u0432\u0430\u043c \u0431\u044b\u043b\u043e \u0438\u043d\u0442\u0435\u0440\u0435\u0441\u043d\u043e, \u044d\u0442\u043e \u0441\u0442\u0430\u0442\u044c\u044f \u0441\u0442\u0430\u043b\u0430 \u0431\u043e\u043b\u0435\u0435 \u0438\u043d\u0444\u043e\u0440\u043c\u0430\u0442\u0438\u0432\u043d\u043e\u0439 \u0447\u0435\u043c \u043f\u0435\u0440\u0432\u044b\u0439 \u0435\u0451 \u0432\u0430\u0440\u0438\u0430\u043d\u0442. <\/p>\n
  \u0421\u043f\u0430\u0441\u0438\u0431\u043e, \u0447\u0442\u043e \u043f\u0440\u043e\u0447\u0438\u0442\u0430\u043b\u0438 \u0441\u0442\u0430\u0442\u044c\u044e \u0434\u043e \u043a\u043e\u043d\u0446\u0430. \u0418 \u044f \u043e\u0447\u0435\u043d\u044c \u043d\u0430\u0434\u0435\u044e\u0441\u044c, \u0447\u0442\u043e mobx-form-validation-kit \u0441\u0442\u0430\u043d\u0435\u0442 \u0441\u0442\u0430\u043d\u0434\u0430\u0440\u0442\u043e\u043c \u043f\u0440\u0438 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u0438 mobx \u043d\u0430 React (TypeScript) \u0438\u043b\u0438 Flutter.
   \u2014 \u041f.\u0441.
  \u0415\u0441\u043b\u0438 \u043d\u0430\u0439\u0434\u0435\u0442\u0435 \u043e\u0448\u0438\u0431\u043a\u0438 \u2013 \u043f\u0438\u0448\u0438\u0442\u0435, \u0438\u0441\u043f\u0440\u0430\u0432\u0438\u043c \ud83d\ude42<\/div>\n
 \u0441\u0441\u044b\u043b\u043a\u0430 \u043d\u0430 \u043e\u0440\u0438\u0433\u0438\u043d\u0430\u043b \u0441\u0442\u0430\u0442\u044c\u0438  https:\/\/habr.com\/ru\/post\/537070\/<\/a><\/p>\n","protected":false},"excerpt":{"rendered":"\n
\n
\u041f\u0440\u0435\u0434\u0438\u0441\u043b\u043e\u0432\u0438\u0435<\/h2>\n
  \u041f\u043e\u0447\u0442\u0438 \u043f\u043e\u043b\u0442\u043e\u0440\u0430 \u0433\u043e\u0434\u0430 \u043d\u0430\u0437\u0430\u0434 \u043c\u044b \u0432\u044b\u043f\u0443\u0441\u0442\u0438\u043b\u0438 \u043f\u0435\u0440\u0432\u0443\u044e \u0432\u0435\u0440\u0441\u0438\u044e \u0431\u0438\u0431\u043b\u0438\u043e\u0442\u0435\u043a\u0438 "\u041d\u043e\u0432\u044b\u0439 \u043f\u0430\u043a\u0435\u0442 \u0432\u0430\u043b\u0438\u0434\u0430\u0446\u0438\u0439 \u0434\u043b\u044f React \u043d\u0430 Mobx @quantumart\/mobx-form-validation-kit<\/a>"
  \u0412\u0440\u0435\u043c\u044f \u0448\u043b\u043e, \u0438 \u0431\u0438\u0431\u043b\u0438\u043e\u0442\u0435\u043a\u0430 \u043a\u043e\u0440\u0440\u0435\u043a\u0442\u0438\u0440\u043e\u0432\u0430\u043b\u0430\u0441\u044c \u0438 \u043d\u0435 \u0441\u0442\u043e\u044f\u043b\u0430 \u043d\u0430 \u043c\u0435\u0441\u0442\u0435, \u0434\u0430 \u0441\u043e\u0431\u0441\u0442\u0432\u0435\u043d\u043d\u043e, \u043a\u0430\u043a \u0438 \u043d\u0430\u0448\u0435 \u0440\u0430\u0437\u0432\u0438\u0442\u0438\u0435 \u0432 \u0446\u0435\u043b\u043e\u043c. \u041c\u044b \u043f\u0435\u0440\u0435\u0448\u043b\u0438 \u043d\u0430 flutter, \u043f\u043e \u043f\u0443\u0442\u0438 \u043f\u043e\u043f\u0438\u043d\u0430\u0432 ReactNative, \u0441\u0434\u0435\u043b\u0430\u043b\u0438 \u0435\u0449\u0435 \u043d\u0435\u0441\u043a\u043e\u043b\u044c\u043a\u043e \u043f\u0440\u043e\u0435\u043a\u0442\u043e\u0432. \u0418 \u043d\u043e\u0432\u044b\u0435 \u0437\u0430\u0434\u0430\u0447\u0438 \u043f\u043e\u0442\u0440\u0435\u0431\u043e\u0432\u0430\u043b\u0438 \u043e\u0442 \u043d\u0430\u0441 \u043d\u043e\u0432\u044b\u0445 \u0438 \u0441\u043e\u0432\u0440\u0435\u043c\u0435\u043d\u043d\u044b\u0445 \u0440\u0435\u0448\u0435\u043d\u0438\u0439, \u0432 \u0442\u043e\u043c \u0447\u0438\u0441\u043b\u0435 \u0438 \u043f\u0435\u0440\u0435\u0440\u0430\u0431\u043e\u0442\u043a\u0438 mobx-form-validation-kit.
  \u0421\u0435\u0433\u043e\u0434\u043d\u044f \u044f \u0440\u0430\u0434 \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u0438\u0442\u044c \u0432\u0430\u043c \u043d\u043e\u0432\u0443\u044e \u0432\u0435\u0440\u0441\u0438\u044e \u043f\u0430\u043a\u0435\u0442\u0430 mobx-form-validation-kit.
  \u0414\u043b\u044f \u0441\u0442\u0440\u043e\u0433\u043e \u0442\u0438\u043f\u0438\u0437\u0438\u0440\u043e\u0432\u0430\u043d\u043d\u043e\u0433\u043e TypeScript
  mobx-form-validation-kit 2.0<\/a>
  \u0418 \u043f\u0435\u0440\u0435\u043f\u0438\u0441\u0430\u043d\u043d\u044b\u0439 \u0432\u0430\u0440\u0438\u0430\u043d\u0442 \u0431\u0438\u0431\u043b\u0438\u043e\u0442\u0435\u043a\u0438 \u043f\u043e\u0434 Flutter
   flutter_mobx_form_validation_kit 2.0<\/a><\/p>\n
    <\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[],"tags":[],"class_list":["post-316324","post","type-post","status-publish","format-standard","hentry"],"_links":{"self":[{"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=\/wp\/v2\/posts\/316324","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=316324"}],"version-history":[{"count":0,"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=\/wp\/v2\/posts\/316324\/revisions"}],"wp:attachment":[{"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=316324"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=316324"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=316324"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}