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]

}

}

}

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

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

(0)
全栈程序员-站长的头像全栈程序员-站长


相关推荐

  • 统计学中ROC曲线的认识

    统计学中ROC曲线的认识ROC曲线的横坐标表示一个负的实例被当作正实例的概率(FPR),纵坐标表示一个正的实例被当作正的实例的概率(TPR)。ROC曲线标识了,为了达到某个TPR,伴随而来的该分类器的FPR是多少当把所有的实例都分类成正的以后,TPR为100%,FPR也是100%,这解释了为什么ROC曲线必然过点(100%,100%)。同理,如果把所有的实例都判为负类,那么,TPR为0,FPR也为0,所以

    2022年5月16日
    57
  • 100道最新Java面试题,常见面试题及答案汇总

    除了掌握扎实的专业技能之外,你还需要一份《Java程序员面试宝典》才能在万千面试者中杀出重围,成功拿下offer。小编特意整理了100道Java面试题,送给大家,希望大家都能顺利通过面试,拿下高薪。赶紧码住吧~~Q1:Java内部类和子类之间有什么区别?答案:内部类是指在一个外部类的内部再定义一个类,内部类对外部类有访问权限,可以访问类中定义的所有变量和方法。子类是从父类(superclass)中继承的类,子类可以访问父类所有public和protected的字段和方法。Q2:Java语言中有哪些

    2022年4月16日
    121
  • 编写测试用例的思路_测试用例的内容

    编写测试用例的思路_测试用例的内容前言用过pytest的小伙伴都知道,pytest的运行方式是非常丰富的,可以说是你想怎么运行怎么运行,想运行哪些运行哪些,那httprunner是否同样可以呢?运行用例的各种方式运行指定路径的用

    2022年7月31日
    10
  • html代码大全表格_html表格代码怎么写

    html代码大全表格_html表格代码怎么写在做前台html中我们经常用到一些表格,苦逼的后台程序猿大多都简简单单的写一些标签,下面分享一下只用h5就能写出一些精美的form&amp;lt;formaction=“”method=“”&amp;gt;&amp;lt;fieldset&amp;gt;&amp;lt;legend&amp;gt;Insertthetitle&amp;lt;/legend&amp;gt;&amp;lt;divalign=“Cen

    2022年8月11日
    9
  • leetcode-41缺失的第一个正数

    leetcode-41缺失的第一个正数原题链接给你一个未排序的整数数组 nums ,请你找出其中没有出现的最小的正整数。进阶:你可以实现时间复杂度为 O(n) 并且只使用常数级别额外空间的解决方案吗?示例 1:输入:nums = [1,2,0]输出:3示例 2:输入:nums = [3,4,-1,1]输出:2示例 3:输入:nums = [7,8,9,11,12]输出:1 提示:0 <= nums.length <= 300-231 <= nums[i] <= 231 – 1题解

    2022年8月8日
    16
  • python中取整数的方法(python中取整符号)

    Python中的round()有两个参数,第一个参数是需要处理的数,第二个参数是数位精度,默认为0。round(3.4)##3round(3.5)##4而有时候会出现奇怪的情况,比如:round(3.24,1)#是四舍五入##3.2round(3.26,1)#是四舍五入##3.3round(3.25,1)#不是四舍五入##3.2######################…

    2022年4月12日
    69

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

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