فرم برای جمعآوری و اعتبارسنجی دادههای ورودی کاربر استفاده میشود. ما از react-hook-form به عنوان کتابخانه کنترل فرم استفاده میکنیم. بیشتر کامپوننتهای فرم ما با react-hook-form یا دیگر کتابخانههای فرم سازگار هستند.
Form یا FormContainer به ما اجازه میدهد تمام FormItem ها را از طریق یک prop layout کنترل کنیم.Form یا FormContainer به ما امکان کنترل اندازه FormItem را نیز میدهد.extra در FormItem اضافه کنیم.FieldArray.کتابخانه React Hook Form یک راهحل قدرتمند و انعطافپذیر برای مدیریت فرمها در برنامههای ریاکت است. این ابزار مدیریت فرم را با ارائه مجموعهای از هوکها و ابزارهایی که فرآیند گرفتن دادهها، اعتبارسنجی و ارسال فرمها را ساده میکند، آسان میسازد. با استفاده از useForm، شما بهراحتی میتوانید وضعیت فرم را مدیریت کنید، تغییرات ورودی را پردازش کنید، اعتبارسنجی انجام دهید و فرمها را با حداقل کد اضافی ارسال کنید. برای اطلاعات بیشتر و مثالها بهمستنداتمراجعه کنید.
زود یک کتابخانه تعریف اسکیما و اعتبارسنجی است که مبتنی بر تایپاسکریپت طراحی شده است. منظور از "اسکیما" هر نوع دادهای، از یک رشته ساده تا یک شیء پیچیده تودرتو است. زود برای کاربرپسندترین تجربه ممکن طراحی شده است. هدف این ابزار حذف تعریفهای تکراری تایپهاست. با زود، شما یک بار اعتبارسنج را تعریف میکنید و زود بهطور خودکار نوع استاتیک تایپاسکریپت را استنتاج میکند. همچنین ترکیب تایپهای ساده به ساختارهای داده پیچیده بسیار آسان است. برای اطلاعات بیشتر و مثالها بهمستندات رسمیمراجعه کنید.
| ویژگی | توضیحات | نوع | پیشفرض |
|---|---|---|---|
| layout | چیدمان فرم | 'horizontal' | 'vertical' | 'inline' | 'vertical' |
| size | اندازه آیتم فرم | 'lg' | 'md' | 'sm' | 'md' |
| labelWidth | عرض برچسب فرم | string | number | 100 |
| ویژگی | توضیحات | نوع | پیشفرض |
|---|---|---|---|
| layout | چیدمان فرم | 'horizontal' | 'vertical' | 'inline' | - |
| size | اندازه آیتم فرم | 'lg' | 'md' | 'sm' | - |
| labelWidth | عرض برچسب فرم | string | number | - |
| errorMessage | پیام خطا که هنگام فعال شدن invalid نمایش داده میشود | string | - |
| invalid | وضعیت اعتبارسنجی آیتم فرم | boolean | - |
| asterisk | آیا علامت ستاره در کنار متن برچسب نمایش داده شود | boolean | - |
| extra | محتوای سفارشی اضافی در کنار متن برچسب | string | ReactNode | - |
| htmlFor | تنظیم مقدار htmlFor برای برچسب فرعی | string | - |