vuejs 基本指令1

2021-09-28 22:21:36 字數 3637 閱讀 9027

碼雲 gitee

gitlab(乙個產品,完全類似github或者gitee,是乙個可以在企業內部執行的**託管平台)(商業公司更願意使用 svn 作為版本控制器)

coding.net(深圳一家公司做的**的託管平台)

v-for 遍歷陣列,物件

1,v-for 是些在最小的迴圈單元裡面的

2,v-for=』』 "引號裡面其實是乙個for in迴圈

3,v-for 可以遍歷陣列和物件

for=

"item in arr"

>

}<

/li>

<

/ul>

"">

<

/script>

var vm=

newvue(}

)<

/script>

<

/body>

v-html 轉譯html原文

1,如果是直接在插值表示式裡面書寫html**,那麼vue不會進行轉譯,為了防止xss攻擊,

2,在需要轉譯的地方加上v-html=" ",引號裡面是html**或者模型變數,vue就會對html**進行轉譯,但是這個方法使用要慎重,要確保你的html**是安全的

3

}//hello

<

/p>

"html"

>

<

/p>

//hello

<

/div>

"">

<

/script>

var vm =

newvue(}

)<

/script>

<

/body>

v-text 設定元素的innertext作為模型變數的值

1, < p>}< /p>有頁面閃爍問題:如果網路差,或者使用者電腦配置差,使用者會看到插值表示式

2,用v-text可以完美的解決頁面閃爍問題,因為這種方式在標籤內沒有插值表示式

3,但是如果標籤之間還有別的內容的話,就會覆蓋,用拼接的方式將標籤裡面原有的東西放在v-text裡面就可以解決

4,但是這裡要注意乙個問題,拼接的時候,外面是單引號,裡面要雙引號,外面雙,裡面就要單

<

!--頁面閃爍問題:如果網路差,或者使用者電腦配置差,使用者會看到插值表示式--

>

}<

/p>

<

!--用v-text可以完美的解決頁面閃爍問題,因為這種方式在標籤內沒有插值表示式--

>

"title"

>

<

/p>

<

!--但是如果標籤之間還有別的內容的話,就會覆蓋,--

>

<

!--解決方法如下,用拼接的方式將標籤裡面原有的東西放在v-text裡面--

>

<

!--但是這裡要注意乙個問題,拼接的時候,外面是單引號,裡面要雙引號,外面雙,裡面就要單--

>

"'內容:'+title"

>

<

/p>

<

/div>

"">

<

/script>

var vm =

newvue(}

)<

/script>

<

/body>

v-cloak 解決頁面閃爍問題

不希望出現閃爍的標籤設定 v-cloak屬性

設定 style 樣式,使用該屬性選擇器:display:none

當執行完畢後,vuejs 會把所有有 v-cloak指令移除

css:

[v-cloak]

<

/style>

html:在標籤上加上v-cloak屬性

}<

/p>

js:這裡沒有需要修改的地方

""

>

<

/script>

var vm =

newvue(}

)<

/script>

v-if 刪除和新增節點

1,true時顯示,false時隱藏

"true"

>

//顯示

}<

/p>

" false "

>

}<

/p>

//隱藏

<

/div>

"">

<

/script>

var vm =

newvue(}

)<

/script>

<

/body>

v-if 和 v-else

1,當v-if 為true時,v-else為false,當v-if為true時,v-else 為 false

"true"

>

//顯示

}<

/p>

else

>

}<

/p>

//隱藏

<

/div>

"">

<

/script>

var vm =

newvue(}

)<

/script>

<

/body>

結果如下,v-if和v-else是將元素移除或者新增

v-show 控制display屬性,顯示與否

當true時,display:block,當false時,display:none

"true"

>

}<

/p>

"false"

>

}<

/p>

<

/div>

"">

<

/script>

var vm =

newvue(}

)<

/script>

<

/body>

結果如下:v-show是控制display的屬性值,但是元素還存在

v-if:只能實現一次的顯示和隱藏

v-show:可以實現多次顯示與隱藏

看你的業務需求如何,合理選擇指令

v-pre 不會解析vuejs語法,原封不動的輸出

}<

/p>

<

!-- 輸出}--

>

"">

<

/script>

var vm =

newvue(}

)<

/script>

<

/body>

基本指令1

題目名稱 linux實驗 基本指令1 題目關鍵字 linux實驗 基本指令1 題目錄入時間 2013 4 1 22 36 02 題目內容 1 root帳號登入,檢視 tmp目錄,如果 tmp目錄下沒有子目錄myshare,則建立該目錄。2 建立帳號testuser。adduser 3 把myshar...

vuejs的使用 指令

vue指令的使用 使用vm上的 data屬性 的語法叫mustache語法 在dom結構中使用js語法,這個型別稱之為jsx語法糖 p 使用vm上的私有屬性 data p 使用vm上擁有的msg p this可以省略 p div mustache語法vue在使用時有兩部分 指令和元件 指令 指令的使...

Linux基本指令 1

1.ls指令 語法 ls 選項 目錄或檔案 功能 1.對於目錄,該命令列出該目錄下的所以子目錄和檔案 2.對於檔案,將列出檔名以及其他資訊 0429 localhost lsls l 列出檔案的詳細資訊 0429 localhost ls l 總用量 0 drwxr xr x.2 0429 0429...