Svelte image preview
Preview a selected image
Table of Contents
<script>
let preview_image = $state();
function handleFileSelect(event) {
const files = event.target.files;
if (files && files.length > 0) {
const reader = new FileReader();
reader.onload = (readerEvent) => {
preview_image = readerEvent.target.result;
};
reader.readAsDataURL(files[0]);
}
}
</script>
<input accept="image/*" type="file" onchange={handleFileSelect} />
{#if preview_image}
<img src={preview_image} alt="placeholder" />
{/if}