vue上传文件组件使用_uniapp支持ios文件上传

vue上传文件组件使用_uniapp支持ios文件上传imgList:[],size:0,limit:undefined}},methods:{//设置fileClick(){document.getElementById(‘upload_file’).click()},fileChange(el){if(!el.target.files[0].size)returnthis.fileList(el.target)el.target.value=‘’},fileList(fileList){letfil

大家好,又见面了,我是你们的朋友全栈君。如果您正在找激活码,请点击查看最新教程,关注关注公众号 “全栈程序员社区” 获取激活教程,可能之前旧版本教程已经失效.最新Idea2022.1教程亲测有效,一键激活。

Jetbrains全系列IDE使用 1年只要46元 售后保障 童叟无欺

imgList: [],

size: 0,

limit: undefined

}

},

methods: {

// 设置

fileClick() {

document.getElementById(‘upload_file’).click()

},

fileChange(el) {

if (!el.target.files[0].size) return

this.fileList(el.target)

el.target.value = ‘’

},

fileList(fileList) {

let files = fileList.files

for (let i = 0; i < files.length; i++) {

// 判断是否为文件夹

// eslint-disable-next-line eqeqeq

if (files[i].type != ‘’) {

this.fileAdd(files[i])

} else {

// 文件夹处理

this.folders(fileList.items[i])

}

}

},

// 文件夹处理

folders(files) {

let _this = this

// 判断是否为原生file

if (files.kind) {

files = files.webkitGetAsEntry()

}

files.createReader().readEntries(function(file) {

for (let i = 0; i < file.length; i++) {

if (file[i].isFile) {

_this.foldersAdd(file[i])

} else {

_this.folders(file[i])

}

}

})

},

foldersAdd(entry) {

let _this = this

entry.file(function(file) {

_this.fileAdd(file)

})

},

fileAdd(file) {

if (this.limit !== undefined) this.limit–

if (this.limit !== undefined && this.limit < 0) return

// 总大小

this.size = this.size + file.size

// 判断是否为图片文件

// eslint-disable-next-line eqeqeq

if (file.type.indexOf(‘image’) == -1) {

file.src = ‘wenjian.png’

this.imgList.push({

file

})

} else {

let reader = new FileReader()

let image = new Image()

let _this = this

reader.readAsDataURL(file)

reader.onload = function() {

file.src = this.result

image.onload = function() {

let width = image.width

let height = image.height

file.width = width

file.height = height

_this.imgList.push({

file

})

console.log(_this.imgList)

}

image.src = file.src

}

}

},

fileDel(index) {

this.size = this.size – this.imgList[index].file.size // 总大小

this.imgList.splice(index, 1)

if (this.limit !== undefined) this.limit = this.imgList.length

},

bytesToSize(bytes) {

if (bytes === 0) return ‘0 B’

let k = 1000 // or 1024

let sizes = [‘B’, ‘KB’, ‘MB’, ‘GB’, ‘TB’, ‘PB’, ‘EB’, ‘ZB’, ‘YB’]

let i = Math.floor(Math.log(bytes) / Math.log(k))

return (bytes / Math.pow(k, i)).toPrecision(3) + ’ ’ + sizes[i]

}

}

}

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 举报,一经查实,本站将立刻删除。

发布者:全栈程序员-用户IM,转载请注明出处:https://javaforall.cn/170649.html原文链接:https://javaforall.cn

【正版授权,激活自己账号】: Jetbrains全家桶Ide使用,1年售后保障,每天仅需1毛

【官方授权 正版激活】: 官方授权 正版激活 支持Jetbrains家族下所有IDE 使用个人JB账号...

(0)


相关推荐

  • html5中的空格怎么写,空格的代码(【html5空格代码怎么写】)「建议收藏」

    html5中的空格怎么写,空格的代码(【html5空格代码怎么写】)「建议收藏」空格的代码(【html5空格代码怎么写】),哪吒游戏网给大家带来详细的空格的代码(【html5空格代码怎么写】)介绍,大家可以阅读一下,希望这篇空格的代码(【html5空格代码怎么写】)可以给你带来参考价值。6.不要应用with,void,eval。每行释注的释注符后要加一个空格后才写解注,如://MynameisCKJ.1.单行释注:用“//”标注,注意免避无意义的释注。2….

  • 构建高并发高可用的电商平台架构实践[通俗易懂]

    构建高并发高可用的电商平台架构实践[通俗易懂]各个维度总结电商平台中的高并发高可用的架构实践,从架构设计的理念到平台的逻辑架构,以及到平台架构中各个模块的介绍

  • Microsoft QAS架接项目「建议收藏」

    Microsoft QAS架接项目「建议收藏」1,p位置玩文件后。运行程序命令是:QCSQueryLabelWithLES.exe-c%CD%\FinalQASModelDir–variantAMyMovie–outputFullLine–clientIdzhcn–queryViewsRawQuery,NormalizedQuery–queryInColumn1-iinput3.txt–qcrank…

  • android和androidx区别(为什么总是听到别人说自己坏话)

    本文同步发表于我的微信公众号,扫一扫文章底部的二维码或在微信搜索郭霖即可关注,每个工作日都有文章更新。Android技术迭代更新很快,各种新出的技术和名词也是层出不穷。不知从什么时候开始,总是会时不时听到AndroidX这个名词,这难道又是什么新出技术吗?相信有很多朋友也会存在这样的疑惑,那么今天我就来写一篇科普文章,向大学介绍AndroidX的前世今生。Android系统在刚刚面世的…

  • 深入浅出的意思是(v4)

    因为工作原因,项目中经常遇到目标检测的任务,因此对目标检测算法会经常使用和关注,比如Yolov3、Yolov4算法。当然,实际项目中很多的第一步,也都是先进行目标检测任务,比如人脸识别、多目标追踪、REID、客流统计等项目。因此目标检测是计算机视觉项目中非常重要的一部分。从2018年Yolov3年提出的两年后,在原作者声名放弃更新Yolo算法后,俄罗斯的Alexey大神扛起了Yolov4的大旗。在此,大白将项目中,需要了解的Yolov3、Yolov4系列相关知识点以及相关代码进行完整的汇总,希望和大家

  • Linux设备树详解(一) 基础知识

    Linux设备树详解(一) 基础知识1.前言关于设备树,之前就经过详细的系统培训,但是本着会用就行的原则,对各个知识点都没有进行系统的总结。都是用到哪里学哪里,时间长了,基本也忘记了。所以对于后期知识各个知识点进行总结。2.为什么要引入DTS在传统Linux内核中,ARM架构的板极硬件细节过多地被硬编码在arch/arm/plat-xxx和arch/arm/mach-xxx,比如板上的platform设备、resource…

发表回复

您的电子邮箱地址不会被公开。

关注全栈程序员社区公众号