pemalam muat naik kumpulan imej vue.js
Pemalam muat naik kumpulan imej vue.js ialah kawalan muat naik imej berdasarkan rangka kerja vue.js Ia sesuai untuk kod muat naik imej pada telefon mudah alih Ia menyokong muat naik berkelompok, seret dan lepaskan muat naik imej nombor dan saiz fail, dsb.
kod 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> Semua sumber di laman web ini disumbangkan oleh netizen atau dicetak semula oleh tapak muat turun utama. Sila semak integriti perisian itu sendiri! Semua sumber di laman web ini adalah untuk rujukan pembelajaran sahaja. Tolong jangan gunakannya untuk tujuan komersial. Jika tidak, anda akan bertanggungjawab untuk semua akibat! Jika terdapat sebarang pelanggaran, sila hubungi kami untuk memadamkannya. Maklumat hubungan: admin@php.cn
Artikel Berkaitan
Tutorial asas VUE3: Gunakan pemalam Vue.js untuk merangkum komponen muat naik imej
15 Jun 2023
Tutorial asas VUE3: Gunakan pemalam Vue.js untuk merangkum komponen muat naik imej Vue.js ialah rangka kerja bahagian hadapan yang popular yang membolehkan pembangun mencipta aplikasi yang lebih cekap dan fleksibel dengan kod yang lebih sedikit. Terutama selepas keluaran Vue.js3, pengoptimuman dan penambahbaikannya telah menjadikan lebih ramai pembangun cenderung untuk menggunakannya. Artikel ini akan memperkenalkan cara menggunakan Vue.js3 untuk merangkum pemalam komponen muat naik imej. Sebelum memulakan, anda perlu memastikan bahawa Vue.js dan VueCLI dipasang. Jika belum dipasang lagi
Pemalam muat naik imej ImgUploadJS: Gunakan API Fail HTML5 untuk melaksanakan muat naik tampal tangkapan skrin dan seret dan lepas muat naik kemahiran tutorial _html5
16 May 2016
Artikel ini terutamanya memperkenalkan pemalam muat naik imej ImgUploadJS: Gunakan API Fail HTML5 untuk melaksanakan muat naik tampal tangkapan skrin dan seret dan lepas muat naik Rakan yang memerlukannya boleh merujuknya.
Laman web kitar semula terpakai yang dibangunkan menggunakan PHP menyokong muat naik kumpulan imej
02 Jul 2023
Laman web kitar semula terpakai yang dibangunkan menggunakan PHP menyokong muat naik secara berkelompok Dengan perubahan dalam persekitaran sosial dan peningkatan kesedaran orang ramai tentang perlindungan alam sekitar, industri kitar semula terpakai secara beransur-ansur muncul. Untuk memudahkan semua orang mengitar semula barangan yang tidak digunakan, kami memutuskan untuk membangunkan tapak web kitar semula terpakai. Laman web ini menyokong pengguna untuk memuat naik gambar secara berkelompok untuk memaparkan keadaan item dengan lebih baik dan meningkatkan pemahaman dan minat pengguna terhadap item tersebut. Sebelum melaksanakan fungsi muat naik kumpulan imej, kita perlu memastikan bahawa struktur asas laman web telah dibina. Ini termasuk reka bentuk pangkalan data dan persediaan, akaun pengguna
Gunakan Python untuk antara muka dengan Qiniu Cloud untuk melaksanakan muat naik kumpulan imej
06 Jul 2023
Gunakan Python untuk antara muka dengan Qiniu Cloud untuk merealisasikan muat naik berkelompok gambar 1. Pengenalan Dengan perkembangan Internet, penggunaan gambar menjadi semakin meluas. Dalam banyak senario aplikasi, kita perlu memuat naik sejumlah besar imej ke pelayan. Storan Awan Qiniu ialah perkhidmatan storan objek teragih berprestasi tinggi, sangat dipercayai, berskala elastik yang menyediakan storan imej, pemprosesan imej dalam talian, pecutan CDN dan fungsi lain. Artikel ini akan memperkenalkan cara menggunakan Python untuk antara muka dengan Qiniu Cloud untuk mencapai muat naik kumpulan imej. 2. Kerja penyediaan Daftar akaun Qiniu Cloud dan dapatkan
Apakah kesan khas kanvas?
18 Aug 2023
Kesan khas kanvas termasuk kesan zarah, animasi baris, pemprosesan imej, animasi teks, visualisasi audio, kesan 3D, pembangunan permainan, dsb. Pengenalan terperinci: 1. Kesan zarah, dengan mengawal kedudukan, kelajuan dan warna zarah untuk mencapai pelbagai kesan, seperti bunga api, titisan hujan, langit berbintang, dll. 2. Animasi garisan, dengan melukis garisan berterusan pada kanvas, mencipta pelbagai kesan. Kesan garis dinamik; 3. Pemprosesan gambar, dengan memproses gambar, anda boleh mencapai pelbagai kesan hebat, seperti penukaran gambar, kesan khas gambar, dan lain-lain.
Apakah perisian yang digunakan untuk mencipta kesan khas Disney TikTok_Tutorial penciptaan wajah kesan khas Disney TikTok
18 Apr 2024
1. Pengeluaran - pengguna hanya perlu memuat naik swafoto mereka sendiri atau potret orang lain untuk menukarnya dengan satu klik, dan operasinya sangat mudah 2. Popular - bukan sahaja wajah kesan khas Disney, tetapi juga kesan khas panas dan popular yang lain; tersedia pada bila-bila masa; Dalam percubaan ini, anda juga boleh membuat penapis sendiri. 1. Selepas memuat turun dan memasang toonme, anda boleh memasukkan perisian dan memilih penapis kesan khas yang anda mahukan. 2. Semak foto yang anda ingin buat dan pilih untuk mula menciptanya dengan segera. 3. Tunggu sebentar, dan gambar kesan khas yang diproses akan muncul. 4. Terdapat butang simpan setempat dan kongsi di sudut kanan atas. Pengeluaran muka kesan khas Douyin Disney dan pengenalan perisian,
![Lima kod kesan khas dinamik Tahun 2022 Harimau yang hebat [Disyorkan]](https://img.php.cn/upload/article/000/000/024/61ef5d41bfe71620.png)
Lima kod kesan khas dinamik Tahun 2022 Harimau yang hebat [Disyorkan]
25 Jan 2022
Sambut Tahun Baru dengan gembira! Tahun Baru 2022 semakin hampir Tahun ini adalah Tahun Harimau di Renyin. Terdapat aliran produk yang tidak berkesudahan dengan pelbagai imej harimau. Laman web PHP Cina berikut meringkaskan dan mengesyorkan kod kesan khas terkini untuk Tahun Harimau, termasuk kod kesan khas untuk menghantar berkat untuk Tahun Harimau, melukis animasi untuk Tahun Harimau dan kod kesan khas yang lain.
Bagaimana untuk melaksanakan kesan khas audio dan pemprosesan audio dalam C++?
26 Aug 2023
Bagaimana untuk melaksanakan kesan khas audio dan pemprosesan audio dalam C++? Pengenalan: Dengan perkembangan teknologi yang berterusan, kesan khas audio dan pemprosesan audio menjadi semakin penting dalam pengeluaran muzik moden, pasca produksi filem dan televisyen serta bidang lain. Sebagai bahasa pengaturcaraan yang cekap, C++ boleh membantu kami melaksanakan pelbagai kesan audio dan fungsi pemprosesan audio. Artikel ini akan memperkenalkan cara melaksanakan kesan khas audio dan pemprosesan audio dalam C++ dan memberikan contoh kod yang berkaitan. 1. Kesan khas audio untuk mencapai kesan gema bunyi Kesan gema bunyi sering digunakan dalam penerbitan muzik dan pasca produksi filem dan televisyen.
Bagaimana untuk melaksanakan kesan khas imej dan video dalam C++?
26 Aug 2023
Bagaimana untuk melaksanakan kesan khas imej dan video dalam C++? Dengan perkembangan sains dan teknologi moden hari ini, kesan khas imej dan video memainkan peranan penting dalam hiburan, pengiklanan, pendidikan dan bidang lain. Sebagai bahasa pengaturcaraan yang berkuasa, C++ menyediakan banyak alatan dan perpustakaan untuk memproses imej dan video. Artikel ini akan memperkenalkan cara melaksanakan kesan khas imej dan video dalam C++ dan menyediakan beberapa contoh kod. 1. Kesan khas imej untuk merealisasikan membaca dan menyimpan imej Untuk merealisasikan kesan khas imej, anda perlu membaca dan menyimpan imej terlebih dahulu. Terdapat banyak perpustakaan pemprosesan imej dalam C++ seperti OpenCV dan
Hot Tools
jQuery+Html5 merealisasikan kod animasi pengakuan yang indah
jQuery+Html5 melaksanakan kod animasi pengakuan yang indah, kesan animasi yang hebat, yang mesti dimiliki oleh pengaturcara untuk mengaku!
Kod kesan khas js pengakuan romantik pasangan
Kod kesan khas JS untuk pengakuan romantis pasangan Kesan khas tersebut boleh digunakan pada laman web fotografi perkahwinan atau diletakkan di laman web peribadi Ia juga merupakan kesan khas yang disyorkan untuk dimuat turun.
Artifak pengakuan cinta js mudah
Artifak pengakuan cinta js asli yang mudah
Kesan ekspresif animasi zarah html5 Bunker
Kod kesan khas ungkapan animasi zarah html5 Bunker, teks kesan khas animasi boleh ditukar dalam kod, anda boleh membuat halaman di mana anda boleh menyesuaikan input teks, ia sepatutnya sangat popular, kesan khas HTML5 ini sangat cantik.
templat antara muka log masuk latar belakang responsif jQuery
jQuery responsif log masuk templat kod sumber html Halaman log masuk menggunakan jquery untuk mengesahkan borang dan menentukan sama ada nama pengguna dan kata laluan memenuhi keperluan Biasanya halaman log masuk adalah halaman yang mesti digunakan pada laman web korporat atau laman web pusat membeli-belah halaman, Apabila pelayar mengezum masuk atau keluar, latar belakang akan mengubah saiz imej mengikut pelayar! Laman web PHP Cina mengesyorkan muat turun!