vue移動端webview視頻輕應用

頁面：列表頁，詳情頁。

使用的技術：vue，vue-resource，vue-router。

依賴包：video.js

後端：三個接口（修改及新增）

遇到的問題：

1，列表進入詳情，視頻不初始化，直接在詳情刷新初始化。

2，列表上劃下劃元素空白。

過程：

比較簡單的輕應用，只有列表頁詳情頁，地址後臺配置，原生入口。

第一次開發視頻相關的頁面，過程當中遇到一個問題，列表進入詳情頁面，視頻沒有渲染，斷點分析，在異步獲取到視頻地址以前，video標籤已經渲染了，新獲取的值沒有成功渲染。因此這裏加了一個watch監控vue定義在data裏的數據，改變的時候賦值並初始化video賦值在一個data數據。

因爲是須要開啓緩存的，因此在watch里加了判斷，watch觸發的時候判斷是否存在初始化的video，若是存在則註銷並將data數據賦值爲null。因爲註銷會將video節點也刪除，因此須要從新createElement並插入到html裏。而後再初始化video。

列表佈局的時候使用了css3 transform來垂直居中，框架中有一條backface-visibility:hidden;，這樣會使得列表下劃上劃的時候元素空白，因此須要設置爲backface-visibility:visible;

<代碼圖片後補>

參考：
video.js
vue-video-player   參考了dispose方法