天天看點

vue2第一部分

vue2第一部分
vue2第一部分
vue2第一部分

 一個小案例(要去官網下載下傳vue的js檔案,放到js檔案夾中):

vue2第一部分
vue2第一部分

容器和vue執行個體隻能一一對應。

在雙大括号中能寫的可以是js表達式和js代碼:

vue2第一部分
vue2第一部分

 ===

vue2第一部分

 v-bind:     表示給後面的字元動态綁定值,可以直接簡寫成:

vue2第一部分
vue2第一部分
vue2第一部分

v-model:value(簡寫:v-model)

vue2第一部分

 容器和執行個體有兩種關聯寫法:

vue2第一部分

 date的兩種寫法:

vue2第一部分

 函數式的簡寫:

vue2第一部分
vue2第一部分

 ==============

MVVM模型:

vue2第一部分
vue2第一部分

 用方法将age屬性注入到person中(這樣注入的值是無法周遊到的,要添加配置項才能修改):

vue2第一部分

 加一個配置項就能周遊到(object.keys就是用來周遊keys):

vue2第一部分

還有幾個配置項:

vue2第一部分

getter和setter:

vue2第一部分

 簡單的一個資料代理(用obj2去改變obj1的x值):

vue2第一部分
vue2第一部分
vue2第一部分

 ============

事件處理:

vue2第一部分
vue2第一部分

====

vue2第一部分
vue2第一部分
vue2第一部分
vue2第一部分

示範用插值文法和method方法:

vue2第一部分

 計算屬性的示範:

vue2第一部分
vue2第一部分
vue2第一部分

 計算屬性的簡寫(隻有查詢沒有修改的時候才能這麼寫):

vue2第一部分

監視屬性:

vue2第一部分

 第二種寫法:

vue2第一部分
vue2第一部分

 深度監視,監視屬性多級結構中的值:

vue2第一部分
vue2第一部分

 監視的簡寫形式(隻有不寫配置項如:deep的時候才可以簡寫):

vue2第一部分
vue2第一部分
vue2第一部分
vue2第一部分
vue2第一部分

 優化一下(三種心情随機出現):

vue2第一部分
vue2第一部分
vue2第一部分
vue2第一部分

 =============

vue2第一部分
vue2第一部分
vue2第一部分

 清單渲染

 周遊數組:

 必須要給每個結構取個唯一的名字,就是key

p就是每個元素,index就是每個元素的索引

vue2第一部分

 周遊對象:

vue2第一部分

 周遊字元串:

vue2第一部分
vue2第一部分

設定key的作用,key的原理:

vue2第一部分
vue2第一部分

清單的過濾:

vue2第一部分
vue2第一部分

 做個優化:

vue2第一部分

 用計算屬性代替watch實作過濾,其中 indexof方法是判斷是否包含,傳回值為-1代表不包含:

vue2第一部分

 =========

清單排序:

vue2第一部分

通過計算屬性實作排序,其中.sort方法就是用來排序,通過兩個參數p1-p2或者p2-p1實作升序或者降序

vue2第一部分

vue對象資料監測的原理P34

vue數組資料監測的原理P35,36

vue2第一部分
vue2第一部分

 ========

過濾器:

vue2第一部分
vue2第一部分

========

vue2第一部分
vue2第一部分
vue2第一部分

 ===========

vue2第一部分
vue2第一部分
vue2第一部分

==================

自定義指令P47

vue2第一部分
vue2第一部分
vue2第一部分
vue2第一部分

生命周期:

vue2第一部分
vue2第一部分
vue2第一部分
vue2第一部分
vue2第一部分
vue2第一部分