input改造文件上传,el-table的改造,点击上传,拖拽上传,多选上传

第一个input标签效果

input改造文件上传,el-table的改造,点击上传,拖拽上传,多选上传_第1张图片

第二个input标签的效果

input改造文件上传,el-table的改造,点击上传,拖拽上传,多选上传_第2张图片

el-table的改造效果

input改造文件上传,el-table的改造,点击上传,拖拽上传,多选上传_第3张图片







input支持拖拽上传但要设置opcity为0,不能设置diaplay:none或者visiables

  如果不使用拖拽上传的话,只点击上传可使用如下

          
上传内容
clickBtn(){ console.log("clickFackBtn"); document.getElementById('fileInput').click() }, handleFileChange(event) { const file = event.target.files[0]; console.log(file); },

input同时也支持多选文件上传

input改造文件上传,el-table的改造,点击上传,拖拽上传,多选上传_第4张图片

你可能感兴趣的:(#,css,vue.js,elementui,javascript)