如何清理 Vue.Js 中的输入

Question

功能完成后，我对干净的输入几乎没有问题 谁能告诉我我做错了什么 功能完成后，我尝试清理输入 但我对此没有任何结果 这是我在 Vue 组件中的代码

<form role="form">
  <div class="card-body">
    <div class="form-group">
      <label for="file">Upload File</label>
      <div class="input-group">
        <div class="custom-file">
          <input
            type="file"
            class="custom-file-input"
            id="file"
            ref="file"
            v-on:change="handleFileUpload"
          />
          <label class="custom-file-label" for="file">Choose file</label>
        </div>
      </div>
    </div>
  </div>
  <div class="card-footer">
    <button v-on:click="onClickUploadAccounts" class="btn btn-primary">Upload</button>
    <button v-on:click="onClickSetLoader" class="btn btn-primary">Loader</button>
  </div>
</form>

---

methods: {
        handleFileUpload(){
            this.file = this.$refs.file.files[0]
        },
        onClickUploadAccounts(){
            let formData = new FormData();
            formData.append('file', this.file);
            this.$store.commit('imports/setIsLoad', true)
            axios.post( '/admin-account-import',
                formData,
                {
                    headers: {
                        'Content-Type': 'multipart/form-data'
                    }
                }
            ).then(() => {
                console.log('SUCCESS!!')
                this.$store.commit('imports/setIsLoad', false)
                this.file = ''
                formData.delete('file')
                formData.append('file', this.file = '')
            })
                .catch(() => {
                    console.log('FAILURE!!');
                });
        },
        onClickSetLoader()
        {
            this.$refs.file.files = ''
        },

    },

Answer 1

您需要将 this.file 设置为 null。 在您的数据中

 data: function () { 
  return {
   file: null 
 }
}

你可以在你的方法中删除

this.file = ''
formData.delete('file')
formData.append('file', this.file = '')