通過 props 傳遞屬性
父級給demo2元件繫結乙個msg資料
複製**
子元件通過定義props來使用msg,$emit觸發外部的函式來改變父級傳入的值
} 複製**
通過 $attrs 來收集屬性
$attrs 會收集元件上繫結的屬性,對應class和style不會處理。如果與props同用,props的優先順序要高於attrs
複製** 子元件中this.$attrs會收集元件上繫結的屬性
} 複製**
通過$listeners 來收集方法
$listeners 會收集元件上繫結的方法。 可以通過傳遞實參的方式改變父元件的值
複製**
子元件中this.lis
tene
rs會收
集繫結在
元件上的
方法。通
過thi
s.
listeners會收集繫結在元件上的方法。通過this.
listen
ers會
收集繫結
在元件上
的方法。
通過th
is.listeners.***()可以直接呼叫,以此可以來修改父元件data中的值
} 複製**
通過provide提供依賴,inject注入依賴實現資料跨多級子元件傳遞
通過給父級的 provide 提供乙個依賴物件,讓其所用子元件都能訪問到這個物件
「provide 和 inject 繫結並不是可響應的。這是刻意為之的。然而,如果你傳入了乙個可監聽的物件,那麼其物件的 property 還是可響應的。
」其實也就是說provide 和 inject 繫結本身不做額外的事情(資料繫結之類),只是將提供的資料暴露給子元件。那麼暴露出來的資料是不是可相應的就取決與資料本身
複製**
後代的子元件可以通過reject注入相應的依賴}
複製**
直接訪問元件例項的方式獲取資料
通過 ref 獲取元件例項
ref 屬性定義在元件上獲取的是元件的vue例項,定義在原生標籤上獲取的是對應的dom
需要等掛載之後才能拿到$refs中的內容
} 複製**
通過$parent/chi
ldre
n獲取組
件例項同
樣的也是
必須在m
ount
ed之後
才能獲取
對應例項
父元件通
過children 獲取元件例項 同樣的也是必須在mounted之後才能獲取對應例項 父元件通過
childr
en獲取
元件例項
同樣的也
是必須在
moun
ted之
後才能獲
取對應實
例父元件
通過children獲取子元件例項
} 複製**
子元件通過$paren獲取父元件例項
} 複製**
定義乙個公共倉庫共享資料
定義 eventbus 共享資料
在vue原型上新增乙個bus
為乙個新
的vue
物件,可
以在全域性
的vue
例項中通
過bus為乙個新的vue物件,可以在全域性的vue例項中通過
bus為乙個
新的vu
e物件,
可以在全
局的vu
e例項中
通過bus獲取到這個vue物件,從而獲取這個物件上的屬性和方法。
在main.js中定義
vue.prototype.bus
=new
vue(
data
:a:1
,b:2
,met
hods
:log
()co
nsol
e.lo
g(th
is.a
))複製
程式碼全域性
vue實
例都能獲
取到定義
在bus = new vue(, methods: } }) 複製** 全域性vue例項都能獲取到定義在
bus=ne
wvue
(dat
a:a:
1,b:
2,me
thod
s:lo
g()c
onso
le.l
og(t
his.
a))復
制**全
局vue
例項都能
獲取到定
義在bus上的屬性和方法
通過 vuex 共享資料
官方給出的跨多元件傳遞資料的解決方案。
store index.js
import vue from 『vue』
import vuex from 『vuex』
vue.use(vuex)
export default new vuex.store(,
mutations: ,
changetest2(state,payload)
},actions: ,payload),2000)}},
modules:
})複製**
在元件中使用
} } } }
你想要知道的Git使用小技巧
git學習篇 5 本篇部落格會持續更新git的一些小技巧,幫助你提公升工作效率。linux系統有上個千命令,但常用的命令也就幾十個,除非你是運維工程師,不然掌握那些常用命令,就足夠應付工作了,其他的可以查閱文件。git的命令也同樣多如牛毛,但常用的卻不多。我們知道,linux系統可以通過alias給...
vue元件之間資料傳遞和通訊方式總結
vue元件之間資料傳遞和通訊方式總結 方式主要包括 父元件 子元件 單向資料流,props 子元件 父元件 觀察者模式,即vue的自定義事件 emit 和 on 非父子元件通訊 中介者模式,即 事件匯流排 bus 父子元件通訊 父鏈和子鏈 vuex 等狀態管理庫 略 1 父元件 子元件,props的...
Vue同級(兄弟)元件間資料的傳遞
同級 兄弟 元件間不能直接傳遞資料,需要建立乙個類似橋梁的載體去實現。1 定義乙個公共檔案public.js,建立位置工程src目錄下與main.js同級 內容是建立乙個空的vue例項 import vue from vue export default new vue 2 建立好以後,同級 兄弟 ...