vue 自己写上传excel组件_vue结合elementui组件 el-upload 上传excel表格（二）

Vue组件代码：

auto-upload属性需要设置成false,否则有些原本的属性或者函数没用上的话会报错！！！(我这种写法比较简便)

class="upload-demo"

ref="upload"

action

:on-change="uploadChange"

:on-remove="handleRemove"

:file-list="fileList"

:limit="1"

:auto-upload="false">

选取文件

上传到服务器

只能上传jpg/png文件，且不超过500kb

js代码部分(接口是axios封装)：

import {} form ......;

export default {

data() {

return {

fileList: [],

};

methods: {

uploadChange(file, fileList){

this.fileList = fileList;

submitUpload() {

let formFile = new FormData();

let file = this.fileList[0].raw;

formFile.append("file", file);

this.getToExcel(formFile);

getToExcel(formFile){

importLoseOrder(formFile).then(res=>{

if(res.data.code==200){

this.successMsg('success', res.data.msg);

}else{

this.errorMsg(res.data.msg);

}

}).catch(err=>{

this.errorMsg('服务器错误');

})

};

//删除触发

handleRemove(file, fileList) {

this.errorMsg('你已成功移除文件：'+file.name+', 剩余文件数量：'+fileList.length);

vue 自己写上传excel组件_vue结合elementui组件 el-upload 上传excel表格（二）相关推荐

vue父组件变量传递子组件_Vue.js 父组件向子组件传递数据通过 props
我的使用场景:父组件:home.vue 子组件:feed-section.vue 父组件 home.vue 通过请求拿到数据后,传递给子组件 feed-section.vue:因为在子组件中需要渲染 ...
vuejs 传参向子组件父组件_VUe.js 父组件向子组件中传值及方法
父组件向子组件中传值 1. Vue实例可以看做是大的组件,那么在其内部定义的私有组件与这个实例之间就出现了父子组件的对应关系. 2. 父子组件在默认的情况下,子组件是无妨访问到父组件中的数据的,所以 ...
vue怎么调用子元素的方法_vue.js 父组件如何触发子组件中的方法
文章目录组件组件 (Component) 是 Vue.js 最强大的功能之一.组件可以扩展 HTML 元素,封装可重用的代码.在较高层面上,组件是自定义元素,Vue.js 的编译器为它添加特殊功能 ...
vue 树形控件可编辑_vue.js element-ui组件改iview 第一期 tree树形控件
此为第一期修改,后期也适配了其他组件,更多查看我得文章 element-ui组件的tree树形控件修改源码改为iview组件实现原理修改了element-ui源码,把源码里面的tree模块提取出来 ...
render注册一个链接组件_vue: 单文件组件 render函数
使用vue-cli创建的vue项目,如何在这种项目中使用组建? 首先创建项目.启动项目我们再来了解一下目录结构,src文件夹是写逻辑代码的地方,public是最终渲染到浏览器的地方. 在public ...
vue 手风琴组件_Vue 使用Element-ui table组件实现手风琴效果
利用Element-UI提供的表格组件做成手风琴效果, 即同时只能有一个行展开效果展示手风琴效果版本说明 "vue": "^2.6.11", " ...
使用el upload标签上传文件的几种常见使用场景（前台+后台）
前言:本篇博客主要介绍ElementUI中el upload上传控件的使用,包含前后台代码. 文章目录一.总体代码二.使用场景 1.添加 2.修改 3.单独上传到服务器一.总体代码 1.前端控件 ...
springboot上传文件同时传参数_Spring Boot 系列：使用 Spring Boot 上传文件
上传文件是互联网中常常应用的场景之一,最典型的情况就是上传头像等,今天就带着带着大家做一个 Spring Boot 上传文件的小案例. 1.pom 包配置我们使用 Spring Boot 版本 2. ...
vue excel导入mysql详细教程_Vue前端上传EXCEL文件，后端（springBoot+MyBatis+MySQL）解析EXCEL并批量插入/更新数据库...
文章目录 Vue前端后端 controller层 service层:如何解析Excel文件 MyBatis:实现批量插入在mysql中设置唯一索引Unique Index MySQL中的inser ...

vue 自己写上传excel组件_vue结合elementui组件 el-upload 上传excel表格（二）

vue 自己写上传excel组件_vue结合elementui组件 el-upload 上传excel表格（二）相关推荐

最新文章

热门文章