Vue.js gaismas kastes komponents bez jebkādām atkarībām
Vue-cool-lightbox
Vue-cool-lightbox ir Vue.js gaismas kastes komponents bez jebkādas atkarības, iedvesmojoties no tā fancybox ar tālummaiņu un videoklipiem
mojang konts aizmirsa paroli
Uzstādīšana
Izmantojiet mezglu pakotņu pārvaldnieku, lai instalētu vue-cool-lightbox.
npm install --save vue-cool-lightbox
un izmantojiet gaismas kārbu:
import CoolLightBox from 'vue-cool-lightbox' export default { components: { CoolLightBox, }, }
Lietošana
importēt CoolLightBox no 'vue-cool-lightbox' eksporta noklusējuma {name: 'app', data: function () {return {items: [{src: 'https://cosmos-images2.imgix.net/file/spina/ photo/20565/191010_nature.jpg '> vienumi: [' http://example.com/image.jpg'> Atribūts nepieciešams tipa Apraksts src Jā virkne multivides avotu, tas var būt attēls vai Youtube / Vimeo / Mp4 video titulu Nē virkne attēla nosaukumu apraksts Nē virkne attēla apraksts īkšķis Nē virkne īkšķa URL, kas izmantots īkšķu blokā Atbalstīti rekvizīti
Atribūts tipa Apraksts Noklusējuma preces Masīvs Attēlu/video masīvs rādītājs Skaitlis Atveramo vienumu rādītājs cilpa Būla Iespējo vienumu pārslēgšanu taisnība slaidrāde Būla Iespējo lighbox slaidrādi taisnība slideshowColorBar Stīga Slaidrādes norises joslas krāsa #fa4242 slideshowDuration Skaitlis Slaidu ilgums slīdrādes laikā (ms) 3000 srcName Stīga Rekvizīta nosaukums, ko izmantot kā attēla/video URL src srcThumb Stīga Rekvizīta nosaukums, ko izmantot kā attēla/video īkšķi īkšķis overlayColor Stīga Pārklājuma krāsa rgba (30, 30, 30, .9)
Atbalstītie sloti
Vārds Apraksts ikona-iepriekšējā Iepriekšējā ikona ikona-nākamā Nākamā ikona aizvērt Aizvērt ikonu
Demo
Lejupielādēt
#vue #vue-lightbox #lightbox