بارگذاری (Upload)
بارگذاری یک کامپوننت است که به کاربر امکان پیوست کردن فایلها و تصاویر را میدهد، این کامپوننت میتواند با فرم استفاده شده و دادهها را به مکان دیگری بارگذاری کند.
پایه (Basic)
مثال پایهای از بارگذاری.
کشیدن و رها کردن (Drag and Drop)
با ویژگی
draggable میتوانیم فایلها را به یک ناحیه خاص بکشیم تا بارگذاری انجام شود.یک فایل را انتخاب کنید یا اینجا بکشید و رها کنید
غیرفعال (Disabled)
کامپوننت بارگذاری را با تنظیم ویژگی
disabled به true غیرفعال کنید.یک فایل را انتخاب کنید یا اینجا بکشید و رها کنید
سفارشیسازی (Customize)
میتوانیم ظاهر پیشفرض بارگذاری را تغییر دهیم.
تصویر خود را اینجا بکشید یا مرور کنید
فرمتهای پشتیبانیشده: jpeg، png، gif
کنترل بارگذاری (Upload Control)
از ویژگی
beforeUpload برای ایجاد یک تابع برگشتی به منظور اعتبارسنجی فایل قبل از بارگذاری استفاده کنید.فقط jpeg یا png (حداکثر 500 کیلوبایت)
تصویر آواتار (Avatar)
مثالی برای بارگذاری تصویر آواتار.
API
بارگذاری (Upload)
| ویژگی | توضیحات | نوع | پیشفرض |
|---|---|---|---|
| accept | نوع فایلهایی که میتوانند به عنوان ویژگی accept وارد شوند. | string | - |
| beforeUpload | تابع برگشتی قبل از بارگذاری فایل، که اگر false یا رشتهای برگرداند، بارگذاری را متوقف میکند. | (file: FileList | null, fileList: File[]) => boolean | string | - |
| disabled | آیا بارگذاری غیرفعال است؟ | boolean | false |
| draggable | آیا بارگذاری کشیدنی فعال است؟ | boolean | false |
| fileList | لیست فایلهای اولیه. | File[] | [] |
| fileListClass | کلاس برای پوشش لیست فایلها. | string | - |
| fileItemClass | کلاس برای هر مورد فایل. | string | - |
| onChange | تابع برگشتی بعد از بارگذاری فایل. | (file: File[], fileList: File[]) => void | - |
| onFileRemove | تابع برگشتی زمانی که یک فایل حذف شد. | (file: File[]) => void | - |
| showList | آیا لیست فایلهای بارگذاری شده نشان داده میشود؟ | boolean | true |
| tip | پیام راهنما زیر بارگذاری. | string | ReactNode | - |
| uploadLimit | حداکثر تعداد فایلهایی که میتوانند بارگذاری شوند. | number | - |