Vue 元件 元件之間的通訊 之全域性元件與區域性元件

2022-05-07 13:54:12 字數 845 閱讀 4202

在上篇部落格中介紹了元件,在註冊元件的簡寫中就用到了全域性元件

//

註冊元件的簡寫方式

vue.component(

'my-componenta

',);

元件可分為全域性元件與區域性元件;

全域性元件: 在全域性api中的vue.component註冊;該專案中所有vue例項內均可以使用;

區域性元件: 在vue例項中的components選項中註冊; 只能在本例項中使用;

現在建立兩個vue例項來進行驗證全域性與區域性的區別:

由圖可知全域性的可以在定義的所有div中進行呼叫,但是區域性只能在其本身定義好進行呼叫:

vue**;

html:

"

one">

"two

">

也可以進行如下方式來進行使用:

全域性元件和區域性元件都可以儲存資料,但是儲存的方式與vue例項中的data稍有不同; 元件裡儲存資料,data後需加上函式,資料寫在函式體中。

例:以下是在區域性元件的data中,定義了name屬性;

最終**:

1

237374"

one">

7576

7778

7980

818283"

two">

8485

8687

8889

9091

92

全域性元件與區域性元件

vue元件之間通訊

個人blog,歡迎關注加收藏 元件之間通訊的幾種方式 1.父向子傳資料 props 2.子向父傳資料 emit 3.兄弟元件傳資料 a.事件匯流排 bus 在父元件的data中bus new vue 建立 事件匯流排 b.傳遞資料 this.roo t.bu s.root.bus.root.b us...

Vue元件之間通訊

vue元件傳值有以下幾種情況 父元件向子元件傳值 子元件向父元件傳值 兄弟元件之間傳值等 一 父元件向子元件傳值 傳值方式 props 動態傳遞值 子元件son 靜態傳值 父元件 子元件 son 1 prop的大小寫 html中的attribute名對大小寫不敏感,所以prop中的駝峰值需要等價於短...

Vue元件 父子元件之間的通訊

最近在學習vue,元件之間的通訊是難點也是重點,所以想稍微總結一下。由於元件的模板無法使用父元件中的資料,所以需要用到props。prop 是你可以在元件上註冊的一些自定義特性。當乙個值傳遞給乙個 prop 特性的時候,它就變成了那個元件例項的乙個屬性。在子元件中註冊了props後,就能將父元件的資...