[Vuejs]-File input not shows file name once it is hidden using v-if

When you use v-if, the input is not hidden, it’s removed from DOM.

To hide an element, use v-show instead:

<div id="app">
  <button @click="switch1=!switch1">switch1</button>
  <div v-show="switch1">
    <h4>Select an image</h4>
    <input type="file" @change="onFileChange">
  </div>
</div>