指令

基礎指令
其他指令

• {{}} 插值表示式
• v-cloak 解決插值表示式的抖動
• v-text 插入文字
• v-html 以標籤形式展示資料
• v-bind 屬性繫結 ：
• v-on 事件繫結 @
• v-model 雙向資料繫結
• v-if 條件渲染
• v-for 迴圈渲染 :key number和string型別

事件修飾符

待完成

• .stop 阻止冒泡
• .prevent 阻止預設事件
• .capture 捕獲事件
• .self 自身觸發
• .once 只觸發一次

過濾器--文字格式化

過濾器的使用

• 用處：插值表示式和v-bind後邊的表示式中
• 應用：要過濾的資料 | 過濾器名稱
• 定義：
  • 全域性過濾器
    Vue.filter('過濾器名稱',function(data,...){})
  • 私有過濾器
    filters:{'過濾器名稱':function(data){}}

就近原則

vue生命週期

vue生命週期

• 建立：beforecreate created beforemount mounted
• 執行：beforeupdate updated
• 銷燬：beforedestory destoryed
• keepalive:activated deactivated

計算屬性

待完成

• computed
  • 本質上是一個方法，定義變數，變數名字不能和data中重名，資料快取
  • 一個數據受多個數據影響的時候，使用computed
• watch
  • 監聽data中的資料，也可以監聽路由，也有資料快取
  • 當一個數據影響多個數據的時候，使用watch

動畫

vue中的動畫

• 過渡類名實現動畫
• 半場動畫

元件

vue元件的使用
vue元件之間的關係

• 全域性元件
  • Vue.component('元件的名稱',{元件的模板物件})
• 私有元件
  • components:{
    '元件名稱'：'元件的模板物件'}
• 元件傳值
  • 父子元件傳值
  • 兄弟元件傳值 （bus匯流排）
• 動態元件
  • component標籤 is繫結具體要展示的元件名

路由

vue路由

• 定義
• 路由傳參
• 路由巢狀
• 程式設計式導航和宣告式導航(未完成)

插槽

vue插槽

• 基本插槽
  <slot></slot>
• 具名插槽
  <slot name="left"></slot>
• 作用域插槽（變數的作用域)
  子元件決定內容，父元件決定樣式

請求api （獲取資料）

vue請求api

• axios
  注意：axios的攔截器
• fetch
• vue-resource（基本不用）

其他

未完成

• promise
• render渲染
  • 屬性，createElements方法 直接根據元件生成html結構，替換受控區域當中的內容
• mixin混入
  • 在單獨的檔案中，定義多個元件中都會用的方法或者資料，或者生命週期的鉤子