tornado+vue实现上传文件

最新推荐文章于 2023-10-23 14:55:40 发布

原创

最新推荐文章于 2023-10-23 14:55:40 发布 · 2.1k 阅读

2 ·

CC 4.0 BY-SA版权

文章标签：

#Python阿里云上传文件 #tornado #vue上传文件

本文档详细记录了如何结合Tornado Web框架和Vue.js前端库，实现文件上传的功能，包括前端表单组件的配置、后端接口的编写以及利用阿里云SDK进行文件上传的步骤。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

要用tornado+vue写一个后台管理系统，记录一下遇到文件上传时候的步骤：

1.Form表单里的代码：(这里是使用的饿了么表单组件)

 <el-form-item label="头像">
            <el-upload
                    class="avatar-uploader"//上传框框的样式
                    v-bind:action="FileUploadInterface"//这是请求后台的接口
                    //是否展示图片列表形式                    
                    :show-file-list="false"
                    :on-success="fund_manager_image_on_success"//接口调用成功之后的方法
                    //上传文件之前的判断方法，校验是否符合上传规范                    
                    :before-upload="fund_manager_image_before_upload">
                    //如果表单对象有图片，展示出来，没有展示要上传图标样式
                   <img v-if="formData.image" :src="formData.image" class="avatar">
                <i v-else class="el-icon-plus avatar-uploader-icon"></i>
            </el-upload>
            //展示图片地址
            <el-input v-model="formData.image"></el-input>

       </el-form-item></