My Vue component code is as follows:
<template>
...
<file-pond v-if="this.$route.params.id"
label-idle='Drag and drop files here'
v-bind:allow-multiple="true"
v-bind:required="true"
v-bind:files="dataFiles"
/>
<file-pond v-else
label-idle='Drag and drop files here'
v-bind:allow-multiple="true"
v-bind:required="true"
accepted-file-types='application/pdf, application/vnd.ms-excel, application/vnd.openxmlformats-officedocument.spreadsheetml.sheet, .xlsx'
/>
...
</template>
I am using the id condition to distinguish between adding form and editing form
Therefore, I want to simplify it by having only one filepond tag
I attempted the following approach:
<file-pond
label-idle='Drag and drop files here'
v-bind:allow-multiple="true"
v-bind:required="true"
v-bind:files="[this.$route.params.id ? dataFiles : '']"
v-bind:accepted-file-types="[this.$route.params.id ? '' : 'application/pdf, application/vnd.ms-excel, application/vnd.openxmlformats-officedocument.spreadsheetml.sheet, .xlsx']"
/>
However, this code is not working. It is throwing an error:
Uncaught TypeError: url.split is not a functionHow can I resolve this issue?