vue的基礎用法(4)

2021-10-23 19:50:43 字數 1582 閱讀 2209

是在不改變原始資料的情況下 修改資料的顯示形式

過濾器可以是串聯使用的

當資料發生改變的時候 過濾器就會重新計算

過濾器使用的時候 使用"|"連線 叫做管道符

>

type

="text"

v-model

="msg"

>

>

}h2>

>

}h2>

div>

src=

"">

script

>

src=

"">

script

>

>

newvue(,

//過濾器

filters:

,addstr2

(value)}}

)script

>

1.元件是可復用的vue例項

2.他帶有乙個名字 我們註冊的時候可以自定義

3.元件的使用 直接把元件的名稱當做標籤來使用

4.元件的命名也不能有大寫字母 如果多個單詞 使用 - 連線

5.元件的使用的時候 頁面中必須有乙個頂級的vue例項 我們直接把元件名稱作為標籤放在頂級vue物件裡面

6.元件的取值 採用的是元件內部的資料 不能往上找,也不能往下找

>

sb>

>

>

sb>

div>

src=

"">

script

>

>

vue.

component

("sb",}

, template:""}

)new

vue(})

script

>

src=

"">

script

>

"com"

type

="text/html"

>

計數器--

}<

/h2>

"button" value=

"點我新增" @click=

"num++"

>

<

/div>

script

>

>

>

jishuqi

>

>

jishuqi

>

>

jishuqi

>

>

jishuqi

>

div>

>

vue.

component

("jishuqi",}

, template:

"#com"})

newvue()

script

>

vue的基礎用法

掛載點 vue 物件中管理的資料 vm viewmodel 可以直接在面板上通過宣告來進行資料訪問 data 瀏覽器顯示如圖 2.1 v html指令 雙大括號會將資料解釋為純文字,而非 html 為了輸出真正的 html 你需要使用 v html 指令 被插入的內容都會被當做 html 資料繫結會...

VUE 入門基礎 4

四,計算屬性 基礎例子 0riginal message computed reversed message var vm new vue computed 宣告了乙個計算屬性 reversedmessage 我們提供的函式將用作屬性 vm.reversedmessage 的 getter cons...

Vue 基礎指令用法總結

v text關聯標籤的文字內容 textcontent 不能讀取html標籤 v html關聯更新元素的 innerhtml 可以讀取html標籤 v bind當表示式的值改變時,將其產生的連帶影響,響應式地作用於 dom 簡寫 class msg 超連結超連結v on元素繫結事件 超連結 超連結事...