vue學習筆記

一.環境搭建

1.全域性安裝官方腳手架 vue-cli,腳手架安裝成功後可以通過 vue -v來檢視版本，如果顯示版本號。說明安裝成功了。

npm install -g @vue/cli

vue create vue-learn

cd vue-learn 

npm run serve

1.普通文字

在 components資料夾下新建乙個檔案叫 d.js。**如下。

import vue from 'vue'

let getoptions = function(type) ,
update: function (el, binding) 
}}vue.directive('md',getoptions('$'))
vue.directive('mr',getoptions('￥'))

1).指令名,如上的md和mr。這個引數類似預設指令裡v-if裡的if。

2).乙個物件。這個物件裡面會有一些方法，bind,update等。這些都不是自定義的，都是框架自身的，直接用就可以。這些方法(bind等)接收一些引數，如el(指令所在的dom元素),binding(包含一些資訊)。具體可以去看文件。

import './components/d.js'

data() 
}

三.計算屬性的簡單使用。

計算屬性的應用場景：具有依賴關係的資料簡體。

下面舉乙個簡單的例子：

假設你欠了別人100(money)塊錢,還了5(a)塊錢。你想知道還需要還多少錢。下面的方式是使用表示式的方式實現的

還需要還多少錢：}

data() 
}

還需要還多少錢：}

data() 
},computed:
}

vue學習 筆記

v model 雙向繫結 v if v else if v else v on 繫結事件 v bind 繫結資料 v cloak 當vue未初始化完成前可不顯示為賦值的 vue屬性名稱 需要給v cloak設定 display none v for i迴圈次數 a資料中的資料 arr定義的陣列 最好...

vue學習筆記

vue學習筆記 從7月2日到7月4日三天的學習成果 一 vue的起步 及配置環境 3 使用vue cli快速搭建vue專案vue init webpack 為專案名 建立成功需要等待一段時間 4 輸入npm run dev編譯專案，成功後根據提示或根據修改的埠號登陸 lacalhost 5.看到下圖...

vue 學習筆記

1.v if v show區別 v if 是 真正 的條件渲染，因為它會確保在切換過程中條件塊內的事件 和子元件適當地被銷毀和重建。v if 也是惰性的 如果在初始渲染時條件為假，則什麼也不做 直到條件第一次變為真時，才會開始渲染條件塊。相比之下，v show 就簡單得多 不管初始條件是什麼，元素總...