using syncfusion-vue-uploader with vue-3

I am using Vue Syncfusion Uploader (ejs-uploader) to upload files. The upload functionality works fine, and Syncfusion provides a function to handle the selected file.

<template>
  <ejs-uploader
    :buttons="buttonsText"
    id="template"
    name="UploadFiles"
    :multiple="false"
    ref="profileUploader"
    @selected="handleProfilePic"
    @removing="fileDeleted($event, 'profile')"
    :disabled="isView"
  />
</template>

<script setup>
import { ref, onMounted } from "vue";

const fileRecordsForUpload = ref([]);
const profileFiles = ref([]);
const props = defineProps(["rowData"]);

const handleProfilePic = (e) => {
  fileRecordsForUpload.value.push({
    fileName: e.filesData[0].rawFile.name,
    file: e.filesData[0].rawFile,
    originalName: e.filesData[0].rawFile.name,
  });
};

onMounted(() => {
  profileFiles.value = props.rowData.driverDocuments
    .filter((file) => file.documentType === "Driver Picture")
    .map((file) => ({
      name: file.documentName,
      type: "image/jpeg", // Default type
      fileSource: file.contentUrl, // File URL
    }));
});
</script>

After successfully uploading a file, when I open the specific record, all other text data loads correctly, but the previously uploaded file is not displayed in the Syncfusion Uploader.

I tried using v-model, but it didn’t work. How can I prepopulate the Syncfusion Uploader with the previously uploaded file when viewing a record?

Any help would be appreciated!