Несколько файлов в Inertia

Давайте рассмотрим ситуацию, когда к записи нужно приложить сразу несколько файлов, а поле принимает только один. Человек выбирает пачку документов, но на сервер уходит лишь первый из них.

У поля ставят атрибут multiple, а имя заканчивают скобками, чтобы на сервер пришёл массив. Каждый файл кладут в папку тем же методом store.

Давайте опишем приём нескольких файлов и список путей:

<?php
	use Illuminate\Http\Request;
	use Illuminate\Support\Facades\Route;
	use Inertia\Inertia;

	Route::get('/posts/create', function () {
		return Inertia::render('Posts/Create', [
			'paths' => [],
		]);
	});

	Route::post('/posts', function (Request $request) {
		$paths = [];

		foreach ($request->file('photos') as $photo) {
			$paths[] = $photo->store('photos');
		}

		return Inertia::render('Posts/Create', [
			'paths' => $paths,
		]);
	});
?>

Давайте зададим поле с выбором нескольких файлов и выведем пути списком:

<script setup>
	import { Form } from '@inertiajs/vue3'

	defineProps({
		paths: Array,
	})
</script>

<template>
	<Form action="/posts" method="post">
		<input
			type="file"
			name="photos[]"
			multiple
		/>
		<button type="submit">Save</button>
	</Form>
	<ul>
		<li v-for="path in paths" :key="path">
			{{ path }}
		</li>
	</ul>
</template>

Сделайте так, чтобы к работнику можно было приложить сразу несколько файлов, и на экране были видны пути всех сохранённых.