最近寫用vue2.0寫一個項目，用到了走馬燈效果，由於項目趕時間，想偷下懶，第一次引用了element組件(純JS也可以寫的出來，趕時間嘛，懂得。。。。)，結果用了發現一個問題，element的組件（Carousel） 走馬燈，高度是固定的，頁面縮小會有空隙。網上查了一大堆資料，都說的不全面，要么報錯，要么根本無法實現。浪費了大半天時間，還不如JS寫的快，既然碰到了，還是想解決掉。。。。。。其實官網給了一個height屬性，根本改不了，改成atuo，100%，都不行，屏幕變大變小都會有間隙
最后還是解決了，其實也簡單，就是監聽屏幕視口大小如果'resize',發生改變了，就獲取圖片的高度height，然后渲染到頁面，方法如下：
ref:
ref 有三種用法：
1、ref 加在普通的元素上，用this.ref.name 獲取到的是dom元素
2、ref 加在子組件上，用this.ref.name 獲取到的是組件實例，可以使用組件的所有方法。
3、如何利用 v-for 和 ref 獲取一組數組或者dom 節點
窗口第一次打開，加載了imgLoad（）方法，第一次獲取圖片在視口中的高度，然后渲染到頁面
接下來通過addEventListenner（）方法監聽視口是否發生改變，如果發生改變，重新調用imgLoad()方法渲染數據到頁面，這樣圖片高度就可以隨視口改變發生改變，適應各種大小屏幕。
為了使大家看的清楚，把代碼貼上
最后成功的效果圖：不管屏幕多大，多小，都沒有空隙。