[Bug Report] Unable to select same file twice when value cleared

[matthieusieben]

Environment

Vuetify Version: 2.0.18
Vue Version: 2.6.10
Browsers: Chrome 76.0.3809.132
OS: Mac OS 10.14.6

Steps to reproduce

Pick a file using a v-file-input, clear the v-model programmatically (using the button in the codepen), try to pick the exact same file again, the input value will not be set.

Expected Behavior

The inner "file" input's value should be cleared when the value prop is changed

Actual Behavior

The inner "file" input element's value is not cleared when the value prop changes

Reproduction Link

https://codepen.io/matthieusieben/pen/NWKEEQo

Other comments

I was able to "hack" around the issue using the following watch function (in the vuetify's VFileInput.ts source code):

    value(val) {
      if (!val) this.$refs.input.value = ''
    },

[dsseng]

you can open a PR with your fix

[ardabzlk]

I've solved this problem by adding :key property to tag, and initialized key value with 0, whenever I want to reset file input I increase :key="inputKey" with 1
My data =>
data() { return { inputKey: 0 } }
My reset function =>
closeNewPhotoDialog() { this.inputKey++; }
My component =>
<v-file-input v-model="newPhotoTextField" :key="inputKey">

[johnleider]

We kindly ask users to not comment on closed/resolved issues. If you believe that this issue has not been correctly resolved, please create a new issue showing the regression or create a new discussion.

If you have any questions, please reach out to us in our Discord community.

[johnleider]

We kindly ask users to not comment on closed/resolved issues. If you believe that this issue has not been correctly resolved, please create a new issue showing the regression or create a new discussion.

If you have any questions, please reach out to us in our Discord community.