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)
全栈程序员-站长的头像全栈程序员-站长


相关推荐

  • .ipynb与.py文件快速互转[通俗易懂]

    .ipynb与.py文件快速互转[通俗易懂].ipynb代码转为.py:法一:在xxx.ipynb所在目录下,打开终端,并输入命令:jupyternbconvert–toscriptxxx.ipynb其中xxx.ipynb是要转换文件的名字,转换后在该目录下出现xxx.py文件(有的版本是xxx.txt文件,再改下后缀即可)。法二:在Jupyternotebook或GoogleColab中打开ipynb文件,然后选择file–downloadas–pythonfile.py代码转为.ipynb:

    2022年8月29日
  • 微服务 eureka_变压吸附的原理

    微服务 eureka_变压吸附的原理文章目录前言一、Eureka是什么?二、Eureka是干什么的?1.服务治理三、Eureka原理解析1.总体流程2.读入数据总结前言       随着互联网技术的发展,系统用户量的增长,很多系统都采用了分布式的方式进行部署。这个固然大大提高了系统的性能和可用性,但是分布式部署导致各种服务数量大增,这给我们进行服务治理和运维带来了困扰。一、Eureka是什么?     &nbsp

    2022年4月19日
  • jmeter登录返回数据给下一个接口_mysql读写分离实现

    jmeter登录返回数据给下一个接口_mysql读写分离实现问题描述场景是这样的,我们的支付系统在一笔支付完成后,需要发出通知给到商户。支付完成的消息通过消息队列发送给通知的服务。通知服务的有一部分处理逻辑是这样的:notifyPersist.saveNotifyRecord(notifyRecord);notifyRecord=rpNotifyService.getNotifyByMerchant…

    2022年10月13日
  • PHP在线客服系统平台源码(完全开源的网页在线客服系统)

    PHP在线客服系统平台源码(完全开源的网页在线客服系统)  在线客服系统是一个使用PHP、JavaScript和CSS开发的即时网页聊天咨询系统。该项目包含管理员和用户端。管理员端管理所有的管理,如编辑站点内容、管理提供者和预订,管理员在这个系统的管理中起着重要的作用。    在线客服系统源码及演示:zxkfym.top    对于用户部分,用户可以浏览主页、关于和服务。用户可以是顾客谁需要家庭服务或服务提供商提供家庭服务的人。为了注册为服务提供商,用户必须填写注册表格。然而,要将服务提供商作为客户预订,用户可以先搜索可用的服务提供商,然后再进行预订。该

    2022年7月19日
  • gcc命令的常用选项_curl常用命令及参数

    gcc命令的常用选项_curl常用命令及参数gcc是GUNC和C++编译器,我们通常使用GCC时,编译器会依次做如下工作:preprocess(预处理),compilation(编译),assembly(汇编),link(链接)。gcc提供了一些选项参数能够让编译器停在某个过程(如编译过程)。

    2022年10月13日
  • iphone上的设备管理去哪里了_iPhone设备管理在哪里找

    iphone上的设备管理去哪里了_iPhone设备管理在哪里找正常是没有设备管理的选项的,当你的iPhone上有未信任程序(已经安装好的才行,正在下载/安装的都不算)时才会有这个选项设置>通用>设备管理

    2022年8月4日

发表回复

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

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