Vue課堂筆記

2021-10-03 04:12:24 字數 1531 閱讀 9231

vue的第一天

什麼是vue??

前端框架的3大馬車之一

1.angular 谷歌公司的 m(資料層)v(檢視)c(控制器) 雙向資料繫結

2.react facebook 檢視層的框架view 虛擬dom

3.vue 尤玉璽 雙向資料+虛擬dom

(前兩個是大型公司 最後是乙個人來維護的)

按照誕生順序來的

vue是一套用於構建使用者介面的漸進式框架 逐層應用開發

入門難度最di???

為什麼要學習vue???

<1>高效性

1.執行效率高 採用虛擬dom 減少真實dom的操作使專案的執行效率大大提高

2.開發效率高 採用元件化開發 將開發者的精力從dom操作解放出來,轉移到資料操作上

<2>

dom操作是制約效率的關鍵,減少dom

修改記憶體中的資料(變數)消耗資源源源小於dom操作

虛擬dom 就是乙個記憶體中的乙個物件 該物件有乙個特點和dom有相同結構

你好

呵呵

虛擬dom

obj=,
}

}

}

建立乙個vue的例項

let vm = new vue(} 進行渲染

name:'你好世界 你好vue'

}})

資料繫結}}

}}虛擬dom』

將data裡的資料在檢視中使用(data)使用者可以看見的 這個過程叫資料繫結,方向data->view

正常的資料型別都可以繫結並顯示 特殊的null undefined 只能繫結 不能顯示

}插值法內部放的是變數和表示式

let vm = new vue(,

num:112,

null:null,

undef:undefined

}})

指令 directive

條件渲染

v-if是乙個指令 條件渲染 控制元素的渲染不渲染

《目標元素 v-if=「變數或者表示式」>事件繫結

v-on+事件名=『事件處理函式』 事件名和原生js一樣

onclick v-on:click

onblur v-on:blur

事件處理函式一定要寫在例項 methods內部

預設引數(啥引數都不傳引數)是事件物件

如果有其他引數 事件物件需要通過 $event 手動傳遞

簡寫方式

v-onclick ==@click

屬性繫結

v-bind

src width height class id ....都叫屬性 屬性後面跟的是固定字串 屬性繫結讓屬性後面跟變數或者表示式 資料的響應式 資料變 頁面自動變 不需要開發者操作dom 將開發者的精力從dom操作解放 轉移到資料操作上

vue課堂筆記

工作中,如果碰到了讓你去編寫乙個api介面,是不是就讓你寫乙個inte ce?api介面包括資料庫 dao層 控制層 servlet vue.js 發音讀音 vju 類似於view,是乙個用於構建使用者介面的漸進式框架。也成為前端框架。也成為mvvm框架。mvvm model view view m...

sqlplus課堂筆記

desc user tables select from user tables where table name emp update 表名 set 列名 修改後資料 where 行名 aaa create table student id number 5,2 primary key,sname...

linux課堂筆記

rw r r 第一位有 d,l 表示普通檔案,d表示目錄,l表示連線檔案 快捷方式 接下來三位為一組,分別表示u所有者,g所屬組,o其他人。r讀,w寫,x執行 代表acl許可權 數字代表引用計數 開頭的檔案代表隱藏檔案 系統檔案 ls l簡稱ll就是ls的詳細資訊 建立目錄 mkdir make d...