pqina / vue-filepond

🔌 A handy FilePond adapter component for Vue
https://pqina.nl/filepond
MIT License
1.93k stars 128 forks source link

[Bug] accepted-file-types prop not working #261

Closed dimzeta closed 2 years ago

dimzeta commented 2 years ago

Is there an existing issue for this?

Have you updated Vue FilePond, FilePond, and all plugins?

Describe the bug

I have installed filepond (4.30.4) & vue-filepond (6.0.3) , copy paste the example and modify accepted-file-types but it seems not working at all.

I tried with different file types: audio/mpeg, audio/, image/...

Here is my code:

<FilePond
    name="audio_pond"
    ref="audio_pond"
    :allow-multiple="false"
    accepted-file-types="audio/mpeg"
    server="/api"
    :files="audioFiles"
    v-on:init="handleFilePondInit"
/>

This is the generated input:

<input class="filepond--browser" type="file" id="filepond--browser-yo8yy0f4n" name="audio_pond" aria-controls="filepond--assistant-yo8yy0f4n" aria-labelledby="filepond--drop-label-yo8yy0f4n">

Reproduction

Copy/paste the code and select a file, you should see all file types allowed. Also, see the generated input.

<FilePond
    name="audio_pond"
    ref="audio_pond"
    :allow-multiple="false"
    accepted-file-types="audio/mpeg"
    server="/api"
    :files="audioFiles"
    v-on:init="handleFilePondInit"
/>

Environment

- Device:Macbook Pro M1
- OS: OSX 12.2.1 Monterey
- Browser: Brave
- Vue version: @vue/cli 5.0.4 / vue 2.6.14
- FilePond version: 6.0.3
dimzeta commented 2 years ago

My bad, I didn't know we need the plugin filepond-plugin-file-validate-type 😅