Vue vuelidate无法工作的文件类型输入

问题描述

我使用validate进行vue js表单验证。（https://vuelidate.js.org/#getting-started）

在所有情况下都能很好地工作。

但是它不能用于表单上载文件验证。

由于文件类型输入无法设置v-model属性，并且在v-model属性添加时间上出现以下错误。

“ v-model”指令不支持“文件”输入类型。

因此该值不变。我的代码示例如下。

<input type="file" id="input-file-Now" class="dropify" multiple accept="image/*"
  @change="model.file = eDatas.target.files" v-bind:class="{'is-invalid': $v.model.file.$error}">
<div v-if="$v.model.file.$error" class="invalid-Feedback">
  Select Image
</div>


data () {
  return {
    model: {}
  }
},validations: {
  model: {
    title: { required },file: {
      required: requiredIf(function (nestedModel) {
        return !this.model.file || this.model.file.length == 0;
      })
    }
  }
},

我尝试requiredIf，但那也没有用。如果您知道此解决方案。请与我分享。

解决方法

我弄错了。 requiredIf是表单文件类型输入验证的解决方案。

我的错误是model值初始化file: []和requiredIf的情况。

data () {
  return {
    model: {
      file: [] // New changes
    }
  }
},validations: {
  model: {
    title: { required },file: {
      required: requiredIf(function (nestedModel) {
        return this.model.file.length == 0; // New changes
      })
    }
  }
}

validate（https://vuelidate.js.org/#getting-started）在vue js中非常有用