Проверка формы, которая не позволит пользователю отправить форму без выбора обязательных полей в Vue. js

Question

1. Когда выбраны выпадающие списки, пользователь нажимает кнопку «Отправить», которая снова отправляет форму на сервер. Я не хочу, чтобы эта кнопка была нажата, если необходимые поля не были выбраны. Есть ли v-if, которая отключит кнопку, если поля не выбраны?

HTML

<form id="csvFile" ref="csvFile">
  <div>
    <div class="large-12 medium-12 small-12 cell">
    <input type="file" id="file" ref="file" :change="handleFileUpload()"/>
    <label>File</label>
    <button  @click="getColumnNames()">Upload</button>
    </div>

  <div class="large-12 medium-12 small-12 cell">
    <label>Submit</label>
    <input type="submit" id="columnNames" ref="columnNames"/>
    <button @click="submitFiles()" :="">Files</button>
  </div>

Javascript

    submitFiles() 
    {
      //Form validation that will not allow a user to submit the form by upon the @click event 
      if(!this.$refs.csvFile.checkValidity())
      {
        return null;
      }
      let formData = new FormData();
      formData.append('file', this.file);
      axios.post('http://localhost:8080/api/contacts/upload-csv',
      formData,
      {
      headers: 
        {
          'Content-Type': 'multipart/form-data'
        }
      }
      )
      .then(function(response){
        console.log('SUCCESS!!');
        console.log(response);

      })
      .catch(function(response){
        console.log('FAILURE!!');
        console.log(response);

      })
    }




  } 
}
</script>