Vue學習系列(八) Vue的v model指令

2021-10-06 21:41:42 字數 822 閱讀 2794

vue中的v-model指令,可以將data資料渲染到html文字中,但是和v-text不同的是,v-model可以雙向繫結data資料,即在html中改變v-model的值,那麼在vue中的資料也會一起改變,同樣改變vue例項中的資料,v-model中的資料也會一起改變。

【注意】v-model和v-bind、v-on不同,它沒有簡寫方式,只能寫成v-model。

doctype

html

>

lang

="en"

>

>

charset

="utf-8"

>

>

titletitle

>

src=

"../../js/vue.js"

>

script

>

head

>

>

>

v-model

="username"

>

>

username的值為:}p

>

@click

="changeusername"

>

改變username的值button

>

div>

body

>

>

newvue(,

methods:}}

)script

>

html

>

Vue學習系列(十六) Vue的元件

我們可以使用vue.component tagname,options 語法註冊乙個全域性元件,在該頁面內,全域性元件可以被多個vue例項共享使用。doctype html lang en charset utf 8 titletitle src js vue.js script head my c...

vue學習系列文章

在試圖用ant design vue搭建專案的時候,在前後端傳資料的時發現對vue基本語法和axios完全了解的很差很差,寫這個系列文章,整合知識,不斷完善,持續學習。若有幸完成專案,視情況在github開源。前後端分離和正向 反向 vue.js特性 前端路由和後端路由 vue2.x響應式資料 雙向...

vue系列學習筆記

1.v if 在vue.js中,我們使用v if指令實現同樣的功能 利用v if控制該元素有還是沒有 template v if 因為v if是乙個指令,需要將它新增到乙個元素上,但如果想切換多個元素,可以把乙個元素當作包裝元素,並在上面使用v if,最終的渲染結果不會包含它 例如2.v show ...