Загрузите несколько изображений в Vue.js и Ларавель

#laravel #vue.js #laravel-5

Вопрос:

Я пытаюсь загрузить несколько файлов одновременно в vue.js и ларавель, код, который я использую, это :

Vue.js код:

  <input type="file" v-validate="'required'" multiple @change="uploadDegree" name="uploadDegree" placeholder="Upload Degree"/>

  uploadDegree(e)
            {
                for (let file of e.target.files) {
                    try {
                        let reader = new FileReader();
                         reader.onloadend = file => {
                         this.user.degree_attachment= reader.resu<
                        };
                        reader.readAsDataURL(file);                      
                    } catch {}
                }
              }

Код Laravel:

  $files = $request->input('degree_attachment');
           foreach($files as $file) {
               $degreename = time() . '.' . explode('/', explode(':', substr($file, 0, strpos($file, ';')))[1])[1];
                $pathDegreeExist = public_path("img/degree_img/"); 
                if(!File::exists($pathDegreeExist)) File::makeDirectory($pathDegreeExist, 777);
                $img = Image::make($file);
                $img->save(public_path('img/degree_img/').$degreename); 
                $newUser->degree_attachment = $degreename;
            }

Я получаю эту ошибку :

 Invalid argument supplied for foreach()

где я пытаюсь получить изображение,

1. $files = $request->file('degree_attachment'); не input() так это file

2. @KamleshPaul: пытался, но все равно получаю ту же ошибку

3. вы отправляете как base64 ? это должно быть this.user.degree_attachment.push(reader.result) , тогда это будет массив, и вы можете перебирать

4. @KamleshPaul: Я пробовал ваш код, но он все еще дает мне Invalid argument supplied for foreach()

Ответ №1:

есть две проблемы , упомянутая в комментарии

и еще я заметил в вашем коде vue , что вы каждый раз переопределяете переменную this.user.degree_attachment с содержимым файла , поэтому, во-первых, это не несколько загрузок, во-вторых, его тип не будет массивом, поэтому контроллер laravel не будет знать, как с ним обращаться, следовательно Invalid argument supplied for foreach() , просто потому, что он не итеративный тип объекта .

ну , я не пробовал это на части laravel, я протестировал vue в этой песочнице , и консоль зарегистрировала массив с содержимым каждого файла в качестве элемента массива, но обычно это запускается вашей проверкой laravel .

    uploadDegree(e) {
      let a = [];
      for (let file of e.target.files) {
        try {
          let reader = new FileReader();
          reader.onloadend = (file) => {
            a.push(reader.result);
          };
          reader.readAsDataURL(file);
          this.degree_attachment = a;
        } catch {}
      }
      console.log(this.degree_attachment);
    },