vue 上传文件非空校验

在Vue.js中，进行文件上传前的非空校验通常是在表单提交之前进行的。当用户选择文件后，你可以通过监听`input[type=file]`元素的变化事件，检查`files`数组是否为空。下面是一个简单的示例：

<template>
  <div>
    <input type="file" @change="handleFileChange" />
    <button @click="uploadFiles">上传</button>
    <p v-if="selectedFiles.length === 0">请选择文件</p>
  </div>
</template>

<script>
export default {
  data() {
    return {
      selectedFiles: [],
    };
  },
  methods: {
    handleFileChange(e) {
      this.selectedFiles = e.target.files;
    },
    uploadFiles() {
      if (this.selectedFiles.length === 0) {
        alert("请先选择文件");
        return;
      }
      // 进行其他文件上传处理...
    },
  },
};
</script>

在这个例子中，`handleFileChange`函数会在用户选择文件后更新`selectedFiles`数组。在`uploadFiles`方法中，我们首先检查`selectedFiles`的长度，如果为空，则显示提示信息并阻止默认的上传行为。