利用vue.js加iview框架的相關組件實現圖片的一個輪播效果


使用HBuilder開發工具:

1:如果還沒下載安裝過vue.js的,就可以在C盤進行對vue的全局下載

創建一個vue項目:

進入該項目,並進行相關依賴的下載安裝

 

在cmd輸入npm install iview --save進行下載安裝,

在HBuilder開發工具打開你所創建的項目

在main.js導入iview的相關js.css文件

在cmd輸入相關命令從而在瀏覽器運行打開該項目

 1 <template>
 2     <Carousel autoplay>
 3         <Carousel-item>
 4             <div class="demo-carousel">1</div>
 5         </Carousel-item>
 6         <Carousel-item>
 7             <div class="demo-carousel">2</div>
 8         </Carousel-item>
 9         <Carousel-item>
10             <div class="demo-carousel">3</div>
11         </Carousel-item>
12         <Carousel-item>
13             <div class="demo-carousel">4</div>
14         </Carousel-item>
15     </Carousel>
16 </template>

一個效果圖:

 

 

 

詳細應用參考

https://www.iviewui.com

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM