VUE課程參考 2 VUE基本使用

2022-03-06 05:24:13 字數 1371 閱讀 7902

1、引入vue.js:

3、在模板中使用資料:}

1、引入vue.js

<

script

src=""

>

script

>

2、建立vue物件

el : 指定根element(選擇器)

data : 初始化資料(頁面可以訪問)

data:

})3、在模板中使用資料

模板語法:雙大括號:}

<

div

id>

}

div>

v-model指令:第乙個m是model,資料模型,就是從後台拿資料

第二個v是view,也就是檢視,資料肯定是要在檢視裡面展示的

第三個vm是viewmodel,也就是檢視模型,也就是vue例項的部分,也就是做dom監聽和資料繫結a、vm層分割了m(model)層和v(view)層,每當view層需要獲取或者儲存資料的時候,都需要vm做中間的處理

b、這樣做的意義是vm層(viewmodel)(vue例項)幫我們做了資料的雙向繫結(具體dom監聽和資料繫結)vue devtools:可以在開發模式下很方便的知道vue的資料狀態和資料變化過程

1

doctype html

>

2<

html

lang

="en"

>

3<

head

>

4<

meta

charset

="utf-8"

>

5<

title

>2、vue基本使用

title

>

6head

>

7<

body

>848

4950

<

script

src=""

>

script

>

51<

div

id="test"

>

52<

p>}

p>

53div

>

54<

script

>

55let vm

=new

vue(

60});

61script

>

6263

6465

6667

6869

7071

7273

7475

7677

body

>

78html

>

VUE課程 2 VUE最簡單例項

1 引入vue.js 3 在模板中使用資料 1 引入vue.js script 2 建立vue物件 el 指定根element 選擇器 data 初始化資料 頁面可以訪問 data 3 在模板中使用資料 模板語法 雙大括號 div 1 doctype html 2 html lang en 3 he...

vue學習筆記 2 vue簡介

本次學習主要來自官網的教程 vue應用是由乙個根vue例項開始的。vue會將資料繫結到data中,當data資料改變時也會導致檢視的改變 觀察者模式 可以實現資料的雙向繫結 響應式 vue例項中的屬性可以通過 屬性名的方式獲取,入 data vue是在初始化時繫結資料的,如果初始化後再次新增元素,則...

VUE基礎知識2 VUE介紹

一 vue介紹 在vue中,很多時候不能用箭頭函式。vue.js 是一套構建使用者介面的漸進式框架。框架和庫的區別 框架 vue,乙個擁有完整的解決方案,我們寫好人家呼叫我。庫 juqery,underscore 模板引擎 zepto,animate.css。我們呼叫它。漸進式vue全家桶 vuej...