Vuejs2 0購物車和位址選配學習筆記

2022-05-09 20:09:32 字數 1993 閱讀 2649

文章原文:在我個人部落格

同時感謝慕課網講師 河畔一角 分享的學習資料

使用vue2.0實現購物車和位址選配功能

從 vue 1.x 遷移【參照官方文件】

2.0

給動態繫結需要用v-bind:src=xx.xxvue2.0src:}是無效的

迴圈。主要用於**,標籤。去迴圈乙個陣列。【凡是看到列表就推薦使用v-for

使用for渲染商品時,若想加索引如下 (限vue2.0)

v-for="(item,index) in productlist"

在商品名字處 }

eg: 例如:

}

注意: 全域性的過濾器不要加s

}功能一樣。但是}在第一次頁面vue木有初始化完成會在頁面上顯示}字元。故文字渲染多用v-text

控制顯示隱藏。dom是存在的。僅僅加display block: display none

控制顯示隱藏。如果dom不顯示,整個dom則沒有不存在。

在做單頁面過程中使用多些。把每乙個網頁做成多個元件然後拼接。起到元件復用。如頁面頭部底部和輪播等。

data中沒有需要使用的資料使,使用set註冊。

vue.set(object, key, value)全域性註冊

this.$set(object, key, value)區域性註冊

資料中是否存在某一屬性,可以用此方法,typeof item.checked==『undefined』

vue裡面,全域性的vue.set和區域性的$.set什麼區別?

刪除: 通過indexof獲取索引,var index = this.productlist.indexof(this.curproduct);

然後splice(index,1)從當前位置開始刪除乙個元素

對於文字框這樣的值,是通過v-model繫結的,v-model具有雙向資料繫結功能,通過+改變量量,那麼文字框的值會相應的去發生變化

但是變數}是不會實時改變的

表示式使用data變數不要加thisv-for 迴圈可以控制迴圈的數量

computed,filters區別是什麼?什麼時候使用computed,什麼時候使用filters

_this的使用_this.address=res.result;什麼時候應該用_thisthis

凡是在指令裡面(在頁面檢視裡面)一定不要使用this,因為當前的指令的作用域已經是th``is了,直接操作即可。若再去加this作用域就發生變化了,故this就無法取得當前變數了。只有在vue的例項的過程中函式裡面去使用this,此時的this就是當前的vue例項data裡面的變數。

VUE2 0實現購物車和位址選配功能學習第五節

第五節 單件商品金額計算和單選全選功能 1.vue精髓在於操作data模型來改變dom,渲染頁面,而不是直接去改變dom 2.加減改變總金額功能 html 有貨 js methods changemoney function product,way else 效果 總金額57.00是實時計算的過程,...

使用vue2實現購物車和位址選配功能

首先,vue基礎js寫法 new vue filters mounted function computed methods v for v model 實時更新 v bind j ascript class item check btn v bind class skzndv filters過濾器...

單點登入和購物車

單點登入實現過程 使用者傳送訪問到web應用,檢查cookies中是否不存在token,如果沒有token,重定向到認證中心,提示使用者註冊登入,使用者登入成功後,在本地cookie生成乙個token,帶著token跳轉到web應用,伺服器檢查token通過後則可以正常訪問。購物車 購物車跟使用者的...