Превью в Inertia

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

У выбранного файла браузер умеет дать временный адрес картинки. Его получают через URL.createObjectURL и ставят в src тега img. На сервер файл для этого не отправляют.

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

<script setup>
	import { ref } from 'vue'

	const url = ref('')

	function show(event) {
		const file = event.target.files[0]
		url.value = URL.createObjectURL(file)
	}
</script>

<template>
	<input type="file" @change="show" />
	<img v-if="url" :src="url" />
</template>

Сделайте так, чтобы при выборе картинки для работника она была видна на странице ещё до отправки.