Vue2 模板template的四種寫法

2021-08-20 03:19:44 字數 945 閱讀 7458

閱讀數:3106

[html] 

view plain

copy

<

divid

=>

<

h1>

我是直接寫在構造器裡的模板1

h1>

div>

<

templateid=

"demo3"

>

<

h1style

="color:red"

>

我是選項模板3

h1>

template

>

<

script

type

="x-template"id=

"demo4"

>

<

h1style

="color:red"

>

我是script標籤模板4

h1>

script

>

<

script

>

var vm

=new

vue(,  

//第2種模板 寫在構造器裡  

//template:`<

h1style

="color:red"

>

我是選項模板2

h1>

`  //第3種模板 寫在<

template

>

標籤裡  

//template:'#demo3'  

//第4種模板 寫在<

script

type

="x-template"

>

標籤裡  

template:'#demo4'  

})  

script

>

推薦第4種。

Vue 的 template 模板相關語法

目錄 1 vue 模板的特點 2 內容展示方面 v text v html v pre 3 繫結屬性方面 v bind 縮寫為 4 繫結事件方面 v on 縮寫為 5 條件判斷指令 v if v else 6 迴圈指令 v for key index 7 顯示與隱藏 v show 8 v cloak...

vue2新人入門

預設對webpack,sass,npm有一定的了解。一些vue指令不會說,反正官方文件有,我也懶得抄。一 超級基礎部分 1.全域性安裝 npm install globall vue cli 已全域性安裝了的不必安裝 2.建立乙個基於webpack的模板專案 vue init webpack 你的專...

Vue2學習筆記

v cloak v text v html v bind v on click.stop click.prevent click.capture click.self click.once v model.lazy trim number 或者通過vue的watch監聽來處理watch b func...