vue ?? API? ???? ?????? ???. ???? ? ?? ?? ??? ??? ??? ? ????? ??? ???? API??? ??? ????$refs.file
或 this.$refs.file
.
<template> <input type="file" class="absolute w-0 h-0 invisible opacity-0" @change="handleImageSelected" ref="file" accept="image/*"> <button @click="$refs.file.click()">Upload</button> <button @click="resetUploadFile">Reset</button> </template> <script setup> import {ref} from 'vue' const imageFile = ref() const imageUrl = ref() function handleImageSelected(e) { if (!e.target.files.length) return; imageFile.value = e.target.files[0]; console.log(e.target.files[0]) let reader = new FileReader(); reader.readAsDataURL(imageFile.value); reader.onload = e => { imageUrl.value = e.target.result; }; } function resetUploadFile() { this.$refs.file.target.value = null imageFile.value = null imageUrl.value = null } </script>
?? ? ?, ???? getCurrentInstance
?? ??? ???? ???.
const instance = getCurrentInstance();
然后您需要執(zhí)行 instance.refs.file.value = null
???? ?? ??? ??? ??? ???.