热门标签 | HotTags
当前位置:  开发笔记 > 运维 > 正文

VUEUPLOAD通过ACTION返回上传结果操作

这篇文章主要介绍了VUEUPLOAD通过ACTION返回上传结果操作,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧

通过Upload 的action方法 返回不了结果,可以通过on-success方法中获取返回结果


     
 
-----------------------------------------
computed: {
   uploadUrl() {    
   return baseUrl + "/ImportExcel/";   
  }
//file为ImportExcel方法返回的结果
onSuccess(file){
    if(file.code=="1")
    {
     this.$Message.error("导入失败:" + file.msg);
     return;
    }      
   },

补充知识:Element-UI中上传的action地址相对问题

我想要在vue里只出现上传地址后缀,然后具体的上传地址,前缀是项目配置里的服务器地址

1、action直接写相对地址


      批量导入
     

这样的结果,上传请求的的前缀都是本地localhost:8080,并不是我想要的相对服务器的地址

2、屏蔽掉action地址,我自己写请求


      批量导入
     

methods里这么写

beforeUpload(file){
  let fd = new FormData();
  fd.append('files',file);//传文件
  fd.append('id',this.srid);//传其他参数
  axios.post('/api/up/file',fd).then(function(res){
      alert('成功');
  })
  return false //屏蔽了action的默认上传
},

这样的吧但是这样的我发过去的东西老是空的,应该是我不太懂FormData()的用法吧,但是我单独用FormData()的get方法,都能get到,后来发现是因为文件编码问题

默认的文件编码application/x-www-form-urlencoded是这个,但是上传文件需要的是multipart/form-data (这个格式的请求太好认, 一长串有没有,里面包括了文件名…),当然有时候也会是这样(files: (binary)),都是ok的

啊~,真的要郁闷了,最后还是让我发现了一种办法

那就是!!!

1、把全局配置的服务器地址引入

import url from '@/http/http'

2、在data里定义url:‘',

3、在create方法里this.url = url;

4、在上传组件的action上


      批量导入
     

好了,都好了,相对地址是服务器地址,上传文件编码也是multipart/form-data

以上这篇VUE UPLOAD 通过ACTION返回上传结果操作就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持。


推荐阅读
  • 本周信息安全小组主要进行了CTF竞赛相关技能的学习,包括HTML和CSS的基础知识、逆向工程的初步探索以及整数溢出漏洞的学习。此外,还掌握了Linux命令行操作及互联网工作原理的基本概念。 ... [详细]
  • Linux 系统启动故障排除指南:MBR 和 GRUB 问题
    本文详细介绍了 Linux 系统启动过程中常见的 MBR 扇区和 GRUB 引导程序故障及其解决方案,涵盖从备份、模拟故障到恢复的具体步骤。 ... [详细]
  • 1:有如下一段程序:packagea.b.c;publicclassTest{privatestaticinti0;publicintgetNext(){return ... [详细]
  • 本文介绍了如何在具备多个IP地址的FTP服务器环境中,通过动态地址端口复用和地址转换技术优化网络配置。重点讨论了2Mb/s DDN专线连接、Cisco 2611路由器及内部网络地址规划。 ... [详细]
  • 深入理解Cookie与Session会话管理
    本文详细介绍了如何通过HTTP响应和请求处理浏览器的Cookie信息,以及如何创建、设置和管理Cookie。同时探讨了会话跟踪技术中的Session机制,解释其原理及应用场景。 ... [详细]
  • 创建第一个 MUI 移动应用项目
    本文将详细介绍如何使用 HBuilder 创建并运行一个基于 MUI 框架的移动应用项目。我们将逐步引导您完成项目的搭建、代码编写以及真机调试,帮助您快速入门移动应用开发。 ... [详细]
  • 深入理解 SQL 视图、存储过程与事务
    本文详细介绍了SQL中的视图、存储过程和事务的概念及应用。视图为用户提供了一种灵活的数据查询方式,存储过程则封装了复杂的SQL逻辑,而事务确保了数据库操作的完整性和一致性。 ... [详细]
  • 梦幻西游挖图奇遇:70级项链意外触发晶清诀,3000W轻松到手
    在梦幻西游中,挖图是一项备受欢迎的活动,无论是小宝图还是高级藏宝图,都吸引了大量玩家参与。通常情况下,小宝图的数量保证了稳定的收益,但特技装备的出现往往能带来意想不到的惊喜。本文讲述了一位玩家通过挖图获得70级晶清项链的故事,最终实现了3000W的游戏币逆袭。 ... [详细]
  • 本文探讨了 RESTful API 和传统接口之间的关键差异,解释了为什么 RESTful API 在设计和实现上具有独特的优势。 ... [详细]
  • 本文详细介绍了Java编程语言中的核心概念和常见面试问题,包括集合类、数据结构、线程处理、Java虚拟机(JVM)、HTTP协议以及Git操作等方面的内容。通过深入分析每个主题,帮助读者更好地理解Java的关键特性和最佳实践。 ... [详细]
  • 如何配置Unturned服务器及其消息设置
    本文详细介绍了Unturned服务器的配置方法和消息设置技巧,帮助用户了解并优化服务器管理。同时,提供了关于云服务资源操作记录、远程登录设置以及文件传输的相关补充信息。 ... [详细]
  • 网络攻防实战:从HTTP到HTTPS的演变
    本文通过一系列日记记录了从发现漏洞到逐步加强安全措施的过程,探讨了如何应对网络攻击并最终实现全面的安全防护。 ... [详细]
  • MQTT技术周报:硬件连接与协议解析
    本周开发笔记重点介绍了在新项目中使用MQTT协议进行硬件连接的技术细节,涵盖其特性、原理及实现步骤。 ... [详细]
  • UNP 第9章:主机名与地址转换
    本章探讨了用于在主机名和数值地址之间进行转换的函数,如gethostbyname和gethostbyaddr。此外,还介绍了getservbyname和getservbyport函数,用于在服务器名和端口号之间进行转换。 ... [详细]
  • 邮件(带附件,模拟文件上传,跨服务器)发送核心代码1.测试邮件发送附件接口***测试邮件发送附件*@parammultipartFile*@return*@RequestMappi ... [详细]
author-avatar
我要知道521无敌
这个家伙很懒,什么也没留下!
PHP1.CN | 中国最专业的PHP中文社区 | DevBox开发工具箱 | json解析格式化 |PHP资讯 | PHP教程 | 数据库技术 | 服务器技术 | 前端开发技术 | PHP框架 | 开发工具 | 在线工具
Copyright © 1998 - 2020 PHP1.CN. All Rights Reserved | 京公网安备 11010802041100号 | 京ICP备19059560号-4 | PHP1.CN 第一PHP社区 版权所有