vue元件之間的通訊

第一種：父元件向子元件傳值利用props

vue.

component
('my-father',}
`,          props:
['money']}
}})var vm =
newvue(,
methods:})
;

vue.

component
('my-father',}
,      components:}}
)var vm =
newvue(,
methods:})
;

/*通過自定義事件，建立乙個vue例項 var eventbus = new vue(),

在需要通訊的元件中，觸發事件元件使用 eventbus.$emit('change', data)，
監聽元件在created（mounted）時使用 eventbus.$on('change', fn)，
並在beforedestroy中呼叫eventbus.$off('change', fn)進行解綁，防止記憶體洩露 */
var eventbus =
newvue()
;    vue.
component
('my-father',}
,      components:)}
,beforedestroy()
},'my-son2':}
}}})
var vm =
newvue(,
methods:})
;

第五種：跨元件傳值

vue.

component
('my-sub1',}
,      provide:
,      components:}'
,              inject:
['money']}
}}}}
)new
vue(
)

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.js最強大的功能之一，核心目標是擴充套件htnl元素，封裝可重用 元件可按照template,style,sc...