اذهب إلى المحتوى
  • 0

مشكلة في رفع الصور في تطبيق باستخدام reac

Ahmed Zehry

السؤال

Recommended Posts

  • 0

إذا كنت تريد رفع أكثر من صورة فيجب وضعهم جميعا فى مكان واحد حتى يتم رفعهم فى الواجهة الخلفية .

حيث لاحظت انك تقوم كل مرة بإستدعاء الدالة handleImageChange بإستبدال الصورة الحالية ولهذا سيتم رفع صورة واحده فقط .

لذلك أولا يجب عليك تغير طريقة إضافة الصورة هكذا :

const handleImageChange = (e) => {
    const file = image;
    file.push(e.target.files[0])
    setimage(file)
  }

ويجب عليك تغير ال image إلى array فى كل مكان هكذا :

const [image, setimage] = useState([])

ويجب عدم وضع الصورة في مصفوفة ال city ولكن فقط قم بوضع الإسم الخاص بالصورة حتى نقوم في الواجهة الخلفية بالتتحقق من الإسم الجديد لها .

وبعد ذلك فى الواجهة الخلفية إذا كنت تقوم بإستخدام multer فيجب استخدام array بدلا من single هكذا :

upload.single('image')

upload.array('image')

حيث يجب إستبدال السطر الأول بالسطر الثانى

وبعد ذلك بعد رفع الصور ستجد الصور فى req.files .  ويمكنك الآن التكرار على ال files والتحقق من المصفوفة cites والتاكد من الإسم القديم originalname و الإسم فى مصفوفة cities و بعد ذلك إستبدال السم القديم في cities بالاسم الجديد filename و هكذا سيتم حفظها في قاعدة البيانات

رابط هذا التعليق
شارك على الشبكات الإجتماعية

انضم إلى النقاش

يمكنك أن تنشر الآن وتسجل لاحقًا. إذا كان لديك حساب، فسجل الدخول الآن لتنشر باسم حسابك.

زائر
أجب على هذا السؤال...

×   لقد أضفت محتوى بخط أو تنسيق مختلف.   Restore formatting

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   جرى استعادة المحتوى السابق..   امسح المحرر

×   You cannot paste images directly. Upload or insert images from URL.

  • إعلانات

  • تابعنا على



×
×
  • أضف...