How to reset uploading file in lwc

Question

When I click on new button then I uploaded the file using lightning file upload now if i'm clicking on cancel button, then I'm again click on new button then the previous uploaded file is there. How can i reset that uploaded file after clicking on cancel button.

Uploading a file

<div class="slds-col slds-size_1-of-1 slds_p_arround ">   
                            <label><span>*</span>Upload Medical Certificate</label>                 
                            <lightning-file-upload name="fileUploader" accept={acceptedFormats} record-id={myRecordId} onuploadfinished={handleUploadFinished}>
                            </lightning-file-upload> {docName}
                        </div>  

Cancel button

<button type="button" class="slds-button slds-button_destructive" onclick={closeSuspendModal}>Cancel</button>

JS

closeSuspendModal()
{
this.isShowSuspendModel=false;   
}

get acceptedFormats() {
        return ['.pdf', '.png', '.docx', '.jpg', '.jpeg'];
    }

    handleUploadFinished(event) {
        // Get the list of uploaded files
        const uploadedFiles = event.detail.files;
        this.docId=uploadedFiles[0].documentId;
        this.docName=uploadedFiles[0].name+' uploaded successfully';
        console.log('1111'+uploadedFiles[0].documentId)
        console.log('1111'+uploadedFiles[0].name)
        
    }

Answer 1

You'll want to unrender the entire modal, or at least the upload component. For example, you could:

<lightning-file-upload if:true={isShowSuspendModal} name="fileUploader" accept={acceptedFormats} record-id={myRecordId} onuploadfinished={handleUploadFinished}>

This would cause the component to completely unrender when the model is hidden, which should cause the values to reset.