這是對于Vue是一套漸進式框架的理解

漸進式代表的含義是:沒有多做職責(zé)之外的事德绿。

vue.js只提供了vue-cli生態(tài)中最核心的組件系統(tǒng)和雙向數(shù)據(jù)綁定。

就好像 vuex、vue-router都屬于圍繞vue.js開發(fā)的庫占锯。

使用Angular,必須接受以下東西:

1缩筛、必須使用它的模塊機制

2消略、必須使用它的依賴注入

3、必須使用它的特殊形式定義組件(這一點每個視圖框架都有瞎抛,這是難以避免的)

所以Angular是帶有比較強的排它性的艺演,如果你的應(yīng)用不是從頭開始,而是要不斷考慮是否跟其他東西集成,這些主張會帶來一些困擾胎撤。

使用React晓殊,你必須理解:

1、函數(shù)式編程的理念

2哩照、需要知道它的副作用

3挺物、什么是純函數(shù)

4、如何隔離飘弧、避免副作用

5识藤、它的侵入性看似沒有Angular那么強,主要因為它是屬于軟性侵入的

Vue與React次伶、Angular的不同是痴昧,但它是漸進的:

1、可以在原有的大系統(tǒng)的上面冠王,把一兩個組件改用它實現(xiàn)赶撰,就是當(dāng)成jQuery來使用

2、可以整個用它全家桶開發(fā)柱彻,當(dāng)Angular來使用

3豪娜、可以用它的視圖,搭配你自己設(shè)計的整個下層使用

4哟楷、可以在底層數(shù)據(jù)邏輯的地方用OO和設(shè)計模式的那套理念

5瘤载、可以函數(shù)式,它只是個輕量視圖而已卖擅,只做了最核心的東西

Vue幾種常用的指令:

1鸣奔、v-if:根據(jù)表達(dá)式的值的真假條件渲染元素。在切換時元素及它的數(shù)據(jù)綁定 / 組件被銷毀并重建惩阶。

2挎狸、v-show:根據(jù)表達(dá)式之真假值,切換元素的 display CSS 屬性断楷。

3锨匆、v-for:循環(huán)指令,基于一個數(shù)組或者對象渲染一個列表冬筒,vue 2.0以上必須需配合 key值 使用统刮。

4、v-bind:動態(tài)地綁定一個或多個特性账千,或一個組件 prop 到表達(dá)式侥蒙。

5、v-on:用于監(jiān)聽指定元素的DOM事件匀奏,比如點擊事件鞭衩。綁定事件監(jiān)聽器。

6、v-model:實現(xiàn)表單輸入和應(yīng)用狀態(tài)之間的雙向綁定

7论衍、v-pre:跳過這個元素和它的子元素的編譯過程瑞佩。可以用來顯示原始 Mustache 標(biāo)簽坯台。跳過大量沒有指令的節(jié)點會加快編譯炬丸。

8、v-once:只渲染元素和組件一次蜒蕾。隨后的重新渲染稠炬,元素/組件及其所有的子節(jié)點將被視為靜態(tài)內(nèi)容并跳過。這可以用于優(yōu)化更新性能咪啡。

Vue常用的修飾符:

v-on?指令常用修飾符:

1首启、.stop -調(diào)用 event.stopPropagation(),禁止事件冒泡撤摸。

2毅桃、.prevent -調(diào)用 event.preventDefault(),阻止事件默認(rèn)行為准夷。

3钥飞、.capture -添加事件偵聽器時使用 capture 模式。

4衫嵌、.self -只當(dāng)事件是從偵聽器綁定的元素本身觸發(fā)時才觸發(fā)回調(diào)读宙。

5、.{keyCode | keyAlias} -只當(dāng)事件是從特定鍵觸發(fā)時才觸發(fā)回調(diào)渐扮。

6、.native -監(jiān)聽組件根元素的原生事件掖棉。

7墓律、.once -只觸發(fā)一次回調(diào)。

8幔亥、.left - (2.2.0)只當(dāng)點擊鼠標(biāo)左鍵時觸發(fā)耻讽。

9、.right - (2.2.0)只當(dāng)點擊鼠標(biāo)右鍵時觸發(fā)帕棉。

10针肥、.middle - (2.2.0)只當(dāng)點擊鼠標(biāo)中鍵時觸發(fā)。

11香伴、.passive - (2.3.0)以 { passive: true } 模式添加偵聽器

(注意N空怼)如果是在自己封裝的組件或者是使用一些第三方的UI庫時,會發(fā)現(xiàn)并不起效果即纲,這時就需要用其他的了

.native修飾符了具帮,如:

//使用示例:

<el-input

??v-model="inputName"

placeholder="搜索你的文件"

??@keyup.enter.native="searchFile(params)"

??>

</el-input>

v-bind指令常用修飾符:

1、.prop -被用于綁定 DOM 屬性 (property)。(差別在哪里蜂厅?)

2匪凡、.camel - (2.1.0+)將 kebab-case 特性名轉(zhuǎn)換為 camelCase. (從 2.1.0 開始支持)

3、.sync (2.3.0+)語法糖掘猿,會擴展成一個更新父組件綁定值的 v-on 偵聽器病游。

v-model指令常用修飾符:

1、.lazy -取代 input 監(jiān)聽 change 事件

2稠通、.number -輸入字符串轉(zhuǎn)為數(shù)字

3衬衬、.trim -輸入首尾空格過濾

而且v-on可以監(jiān)聽多個方法,例如:

<input type="text" :value="name" @input="onInput" @focus="onFocus" @blur="onBlur" />

但是同一種事件類型的方法采记,只會響應(yīng)第一個佣耐,例如:

<a href="javascript:;" @click="methodsOne" @click="methodsTwo"></a>

只會響應(yīng)methodsOne方法

?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末,一起剝皮案震驚了整個濱河市唧龄,隨后出現(xiàn)的幾起案子兼砖,更是在濱河造成了極大的恐慌,老刑警劉巖既棺,帶你破解...
    沈念sama閱讀 222,627評論 6 517
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件讽挟,死亡現(xiàn)場離奇詭異,居然都是意外死亡丸冕,警方通過查閱死者的電腦和手機耽梅,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 95,180評論 3 399
  • 文/潘曉璐 我一進店門,熙熙樓的掌柜王于貴愁眉苦臉地迎上來胖烛,“玉大人眼姐,你說我怎么就攤上這事∨宸” “怎么了众旗?”我有些...
    開封第一講書人閱讀 169,346評論 0 362
  • 文/不壞的土叔 我叫張陵,是天一觀的道長趟畏。 經(jīng)常有香客問我贡歧,道長,這世上最難降的妖魔是什么赋秀? 我笑而不...
    開封第一講書人閱讀 60,097評論 1 300
  • 正文 為了忘掉前任利朵,我火速辦了婚禮,結(jié)果婚禮上猎莲,老公的妹妹穿的比我還像新娘绍弟。我一直安慰自己,他們只是感情好著洼,可當(dāng)我...
    茶點故事閱讀 69,100評論 6 398
  • 文/花漫 我一把揭開白布晌柬。 她就那樣靜靜地躺著姥份,像睡著了一般。 火紅的嫁衣襯著肌膚如雪年碘。 梳的紋絲不亂的頭發(fā)上澈歉,一...
    開封第一講書人閱讀 52,696評論 1 312
  • 那天,我揣著相機與錄音屿衅,去河邊找鬼埃难。 笑死,一個胖子當(dāng)著我的面吹牛涤久,可吹牛的內(nèi)容都是我干的涡尘。 我是一名探鬼主播,決...
    沈念sama閱讀 41,165評論 3 422
  • 文/蒼蘭香墨 我猛地睜開眼响迂,長吁一口氣:“原來是場噩夢啊……” “哼考抄!你這毒婦竟也來了?” 一聲冷哼從身側(cè)響起蔗彤,我...
    開封第一講書人閱讀 40,108評論 0 277
  • 序言:老撾萬榮一對情侶失蹤川梅,失蹤者是張志新(化名)和其女友劉穎,沒想到半個月后然遏,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體贫途,經(jīng)...
    沈念sama閱讀 46,646評論 1 319
  • 正文 獨居荒郊野嶺守林人離奇死亡,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點故事閱讀 38,709評論 3 342
  • 正文 我和宋清朗相戀三年待侵,在試婚紗的時候發(fā)現(xiàn)自己被綠了丢早。 大學(xué)時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片。...
    茶點故事閱讀 40,861評論 1 353
  • 序言:一個原本活蹦亂跳的男人離奇死亡秧倾,死狀恐怖怨酝,靈堂內(nèi)的尸體忽然破棺而出,到底是詐尸還是另有隱情那先,我是刑警寧澤农猬,帶...
    沈念sama閱讀 36,527評論 5 351
  • 正文 年R本政府宣布,位于F島的核電站胃榕,受9級特大地震影響盛险,放射性物質(zhì)發(fā)生泄漏瞄摊。R本人自食惡果不足惜勋又,卻給世界環(huán)境...
    茶點故事閱讀 42,196評論 3 336
  • 文/蒙蒙 一、第九天 我趴在偏房一處隱蔽的房頂上張望换帜。 院中可真熱鬧楔壤,春花似錦、人聲如沸惯驼。這莊子的主人今日做“春日...
    開封第一講書人閱讀 32,698評論 0 25
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽。三九已至隙畜,卻和暖如春抖部,著一層夾襖步出監(jiān)牢的瞬間,已是汗流浹背议惰。 一陣腳步聲響...
    開封第一講書人閱讀 33,804評論 1 274
  • 我被黑心中介騙來泰國打工慎颗, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留,地道東北人言询。 一個月前我還...
    沈念sama閱讀 49,287評論 3 379
  • 正文 我出身青樓俯萎,卻偏偏與公主長得像,于是被迫代替她去往敵國和親运杭。 傳聞我的和親對象是個殘疾皇子夫啊,可洞房花燭夜當(dāng)晚...
    茶點故事閱讀 45,860評論 2 361

推薦閱讀更多精彩內(nèi)容

  • 這篇筆記主要包含 Vue 2 不同于 Vue 1 或者特有的內(nèi)容,還有我對于 Vue 1.0 印象不深的內(nèi)容辆憔。關(guān)于...
    云之外閱讀 5,052評論 0 29
  • 主要還是自己看的撇眯,所有內(nèi)容來自官方文檔。 介紹 Vue.js 是什么 Vue (讀音 /vju?/躁愿,類似于 vie...
    Leonzai閱讀 3,358評論 0 25
  • 一:什么是閉包叛本?閉包的用處? (1)閉包就是能夠讀取其他函數(shù)內(nèi)部變量的函數(shù)彤钟。在本質(zhì)上来候,閉包就 是將函數(shù)內(nèi)部和函數(shù)外...
    xuguibin閱讀 9,640評論 1 52
  • 摘要: 2016年最火的前端框架當(dāng)屬Vue.js了,很多使用過vue的程序員這樣評價它逸雹,“vue.js兼具angu...
    OSC開源社區(qū)閱讀 23,684評論 2 149
  • Vue 實例 屬性和方法 每個 Vue 實例都會代理其 data 對象里所有的屬性:var data = { a:...
    云之外閱讀 2,221評論 0 6