更多>
最新下载
24小时阅读排行榜
- 1 摩根大通推出IndexGPT:智能化投资建议引领新潮流
- 2 Linux系统的VPS性能怎么测试
- 3 php redis如何实现定时任务
- 4 mysql标识列的特点有哪些
- 5 现场对标ChatGPT!又一AI大模型发布,还要渗透这么多行业
- 6 VR在智慧旅游行业的应用
- 7 中国首个Pocket Gallery虚拟展厅亮相中央美术学院美术馆
- 8 重大安全风险!美光公司产品对中国关键信息基础设施构成威胁
- 9 新一代天猫精灵评测:里面住了个温暖还话痨的AI朋友
- 10 苹果江郎才尽?前营销高管不看好苹果AR/VR头显。
- 11 MySQL的循环语句有哪些
- 12 AIGC能为元宇宙里的「人」做些什么?|1号AIGC季②
- 13 AI将夺走人类的“饭碗”?听听科技大咖们怎么说!
- 14 升级到 Windows 11 后如何避免垃圾邮件
- 15 苹果限制员工使用ChatGPT等外部AI,担心泄露机密数据
更多>
最新教程
-
- python大神Mosh,零基础小白6小时完全入门
- 308 2024-04-10
-
- MySQL 初学入门(mosh老师)
- 290 2024-04-07
-
- Mock.js | Axios.js | Json | Ajax--十天精品课堂
- 1362 2024-03-29
-
- 微信小程序开发之API篇
- 2907 2024-02-20
-
- Webpack4.x---十天技能课堂
- 3352 2024-02-02
-
- Bootstrap4.x---十天精品课堂
- 3534 2024-01-30
vue.js图片批量上传插件
js代码
<script src="js/vue2.2.2.js"></script> <script> // import up from './src/components/Hello' var app = new Vue({ el: '#app', data () { return { imgList: [], size: 0 } }, methods: { fileClick(){ document.getElementById('upload_file').click() }, fileChange(el){ if (!el.target.files[0].size) return; this.fileList(el.target.files); el.target.value = '' }, fileList(files){ for (let i = 0; i < files.length; i++) { this.fileAdd(files[i]); } }, fileAdd(file){ this.size = this.size + file.size;//总大小 let reader = new FileReader(); reader.vue = this; reader.readAsDataURL(file); reader.onload = function () { file.src = this.result; this.vue.imgList.push({ file }); } }, fileDel(index){ this.size = this.size - this.imgList[index].file.size;//总大小 this.imgList.splice(index, 1); }, bytesToSize(bytes){ if (bytes === 0) return '0 B'; let k = 1000, // or 1024 sizes = ['B', 'KB', 'MB', 'GB', 'TB', 'PB', 'EB', 'ZB', 'YB'], i = Math.floor(Math.log(bytes) / Math.log(k)); return (bytes / Math.pow(k, i)).toPrecision(3) + ' ' + sizes[i]; }, dragenter(el){ el.stopPropagation(); el.preventDefault(); }, dragover(el){ el.stopPropagation(); el.preventDefault(); }, drop(el){ el.stopPropagation(); el.preventDefault(); this.fileList(el.dataTransfer.files); } } }) </script>
本站所有资源都是由网友投搞发布,或转载各大下载站,请自行检测软件的完整性!本站所有资源仅供学习与参考,请勿用于商业用途,否则产生的一切后果将由您自己承担!如有侵权请联系我们删除下架,联系方式:admin@php.cn