מסמך זה תורגם על ידי בינה מלאכותית. לכל אי דיוק, אנא עיין בגרסה האנגלית
עבור קבצים שהועלו, ממשק המשתמש ב-frontend יכול להציג תצוגות מקדימות שונות בהתאם לסוגי הקבצים. שדה הקבצים המצורפים של מנהל הקבצים כולל תצוגה מקדימה מובנית מבוססת דפדפן (משובצת ב-iframe), התומכת ברוב סוגי הקבצים (כגון תמונות, סרטונים, אודיו ו-PDF) לתצוגה מקדימה ישירה בדפדפן. כאשר סוג קובץ אינו נתמך לתצוגה מקדימה בדפדפן, או כאשר נדרשת אינטראקציה מיוחדת בתצוגה המקדימה, ניתן להרחיב רכיבי תצוגה מקדימה נוספים בהתבסס על סוג הקובץ.
לדוגמה, אם ברצונכם להרחיב רכיב קרוסלה עבור קבצי תמונה, תוכלו להשתמש בקוד הבא:
attachmentFileTypes הוא אובייקט כניסה המסופק על ידי חבילת @nocobase/client להרחבת סוגי קבצים. השתמשו בשיטת add שלו כדי להרחיב אובייקט מתאר של סוג קובץ.
כל סוג קובץ חייב לממש שיטת match() כדי לבדוק אם סוג הקובץ עומד בדרישות. בדוגמה, נעשה שימוש בשיטה מחבילת mime-match לבדיקת מאפיין ה-mimetype של הקובץ. אם הוא תואם לסוג image/*, הוא נחשב לסוג קובץ הדורש טיפול. אם אין התאמה, המערכת תחזור לטיפול בסוג המובנה.
המאפיין Previewer באובייקט מתאר הסוג הוא הרכיב המשמש לתצוגה מקדימה. כאשר סוג הקובץ תואם, רכיב זה יוצג לתצוגה מקדימה. בדרך כלל מומלץ להשתמש ברכיב מסוג מודל (כמו <Modal />) כקונטיינר בסיסי, ולאחר מכן למקם את התצוגה המקדימה והתוכן האינטראקטיבי בתוך רכיב זה כדי לממש את פונקציונליות התצוגה המקדימה.
attachmentFileTypesattachmentFileTypes הוא מופע גלובלי, המיובא מ-@nocobase/client:
attachmentFileTypes.add()רושם אובייקט מתאר חדש של סוג קובץ במרכז הרישום של סוגי הקבצים. סוג אובייקט המתאר הוא AttachmentFileType.
AttachmentFileTypematch()שיטה להתאמת פורמט קובץ.
הפרמטר file הוא אובייקט נתונים של הקובץ שהועלה, המכיל מאפיינים רלוונטיים שניתן להשתמש בהם לקביעת סוג:
mimetype: תיאור ה-mimetypeextname: סיומת הקובץ, כולל הנקודה "."path: הנתיב היחסי לאחסון הקובץurl: כתובת ה-URL של הקובץערך ההחזרה הוא מסוג boolean, המציין את תוצאת ההתאמה.
Previewerרכיב React לתצוגה מקדימה של הקובץ.
פרמטרי ה-Props המועברים הם:
index: האינדקס של הקובץ ברשימת הקבצים המצורפיםlist: רשימת הקבצים המצורפיםonSwitchIndex: שיטה להחלפת האינדקסניתן להעביר ל-onSwitchIndex כל ערך אינדקס מתוך ה-list כדי לעבור לקובץ אחר. אם משתמשים ב-null כפרמטר להחלפה, רכיב התצוגה המקדימה ייסגר ישירות.