封裝Vue輪播圖
阿新 • • 發佈:2019-02-18
ssi pread turn ams dex sta 分享圖片 lin res slot
生命周期 操作dom在mounted 操作數據在created 操作數據也可以放在mounted
$nextTick 上面的執行 下面的才會更新
v-once 只渲染一次dom 加上datasorce.length>0 有內容才執行
Vue不考慮IE的兼容 只支持IE8以上
為什麽不在index.html文件夾下寫請求數據?
:引入的jquery的包比vue框架還要大的多
引入來只做一個ajax請求 並不合理
體現不了jquery操作DOM的優勢
vue中數據改變渲染到頁面發送變化 不需要用到dom操作
因此用到一款vue插件
axios 專做ajax請求
安裝axios
$npm install axios
Get請求
//通過給定的ID來發送請求 axios.get(‘/user?ID=12345‘) .then((response)=>{ console.log(response); }) .catch((err)=>{ console.log(err); }); //以上請求也可以通過這種方式來發送 axios.get(‘/user‘, { params:{ ID:12345 } }) .then((response)=>{ console.log(response); }) .catch((err)=>{ console.log(err); });
post請求
axios.post(‘/user‘, { firstName:‘Fred‘, lastName:‘Flintstone‘ }) .then(function(res){ console.log(res); }) .catch(function(err){ console.log(err); });
一次性發送多個
function getUserAccount(){ return axios.get(‘/user/12345‘); } function getUserPermissions(){ return axios.get(‘/user/12345/permissions‘); } axios.all([getUserAccount(),getUserPermissions()]) .then(axios.spread(function(acct,perms){ //當這兩個請求都完成的時候會觸發這個函數,兩個參數分別代表返回的結果 }))
-------------------整理於yingxiang 20190218
封裝Vue輪播圖