vue-simple-uploader自动上传

Vue-Simple-Uploader是一个轻量级的Vue.js组件，它用于简化文件上传操作。这个插件允许你在Vue项目中轻松地添加文件上传功能，支持单个或批量选择文件，并提供了一些基本的事件处理和状态管理。它的核心特点包括：

1. **易于集成**：直接引入并注册组件到Vue实例上即可使用，不需要额外配置复杂的axios或其他网络请求库。

2. **响应式**：通过watchers实时更新上传进度、状态信息等，用户体验更佳。

3. **可配置**：可以自定义上传按钮样式、上传URL、上传限制、错误提示等。

4. **支持断点续传**：如果网络中断，上传会自动从上次中断的地方继续。

5. **回调函数**：提供上传开始、进度、完成以及失败的钩子，开发者可以根据需求定制相应的业务逻辑。

要使用Vue-Simple-Uploader，首先需要安装该组件，然后在模板中导入并使用它，例如：

<template>
  <div>
    <vue-simple-uploader :action="uploadUrl" @success="handleSuccess" @error="handleError"></vue-simple-uploader>
  </div>
</template>

<script>
import VueSimpleUploader from 'vue-simple-uploader';

export default {
  components: {
    VueSimpleUploader,
  },
  data() {
    return {
      uploadUrl: '/api/upload',
    };
  },
  methods: {
    handleSubmit(file) {
      // 可选：预处理文件，如压缩、转换等
      this.$refs.uploader.submit(file);
    },
    handleSuccess(response) {
      console.log('上传成功:', response);
    },
    handleError(error) {
      console.error('上传失败:', error);
    },
  },
};
</script>