摘要:本文章主要講了組件如何進行數據的傳遞,從簡單的組件里面的數據如何顯示,子組件里面的數據顯示,子組件獲取父組件的數據,子組件主動發送數據給父組件。
本文章主要講了組件如何進行數據的傳遞,從簡單的組件里面的數據如何顯示,子組件里面的數據顯示,子組件獲取父組件的數據,子組件主動發送數據給父組件。
1.獲取父組件數據 疑問:多層事件可以通過冒泡獲得,vue 里面的多層數據是不是也可以直接獲取呢? 驗證方法: 1.先在組件里面定義data 的數據,模版以及子組件 2.在子組件里面直接使用父組件里面的data數據components:{ //父級組件 "aaa":{ template:"結果:不能 實踐結果是子級組件是不能直接獲取父級的組件的數據 2.通過 props 從父級傳遞數據到子級 步驟: 1.子組件綁定父組件的數據 2.子組件里面傳遞別稱的數據我是aa組件
", data(){ return { msg:"我是父組件的數據" } }, components:{ "bbb":{//子級組件 template:" 我是bbb-->{{msg}}
" } } }
代碼例子
3.子組件傳遞數據的類型聲明可以在props 聲明傳遞的數據的類型,如
props:{ "mmm":String, "num":Number },
實際代碼例子
3.父組件獲取子組件數據——> $emit() 實現步驟: 1.子組件 發送數據 vm.$emit("方法名","數據"); 2.父組件 接收數據 v-on: @ 實現相關方法我是父級 -> {{msg}}
代碼:
組件 我是父級 -> {{msg}}子組件-
代碼例子
文章版權歸作者所有,未經允許請勿轉載,若此文章存在違規行為,您可以聯系管理員刪除。
轉載請注明本文地址:http://specialneedsforspecialkids.com/yun/85029.html
摘要:本文章主要講了組件如何進行數據的傳遞,從簡單的組件里面的數據如何顯示,子組件里面的數據顯示,子組件獲取父組件的數據,子組件主動發送數據給父組件。 本文章主要講了組件如何進行數據的傳遞,從簡單的組件里面的數據如何顯示,子組件里面的數據顯示,子組件獲取父組件的數據,子組件主動發送數據給父組件。 1.獲取父組件數據 疑問:多層事件可以通過冒泡獲得,vue 里面的多層數據是不是也可以直接獲取呢...
摘要:本文章主要講了組件如何進行數據的傳遞,從簡單的組件里面的數據如何顯示,子組件里面的數據顯示,子組件獲取父組件的數據,子組件主動發送數據給父組件。 本文章主要講了組件如何進行數據的傳遞,從簡單的組件里面的數據如何顯示,子組件里面的數據顯示,子組件獲取父組件的數據,子組件主動發送數據給父組件。 1.獲取父組件數據 疑問:多層事件可以通過冒泡獲得,vue 里面的多層數據是不是也可以直接獲取呢...
摘要:事件總線事件總線首先創建了一個名為的空的實例然后全局定義了組件最后創建了實例。在父組件模板中,子組件標簽上使用指定一個名稱,并在父組件內通過來訪問指定名稱的子組件。 學習筆記:組件詳解 組件詳解 組件與復用 Vue組件需要注冊后才可以使用。注冊有全局注冊和局部注冊兩種方式。 全局注冊 Vue.component(my-component, {}); 要在父實例中使用這個組件,必須要...
摘要:組件之間的數據交互方式父子級數據同步方法與同音我是父級,我的數據是在這里加入方法改變我是子級數據部分今天天氣不錯父級數據改變數據版本利用了原生的對象特性引用當父級數據是對象形式的時候在作用域中傳遞的就不再是以值的形式傳遞,而是 組件之間的數據交互方式 父子級數據同步: 1.x方法: .sync - 與think同音 我是父級,我的數據是=>{{msg1}} ...
閱讀 826·2021-11-22 11:59
閱讀 3230·2021-11-17 09:33
閱讀 2308·2021-09-29 09:34
閱讀 1941·2021-09-22 15:25
閱讀 1955·2019-08-30 15:55
閱讀 1321·2019-08-30 15:55
閱讀 530·2019-08-30 15:53
閱讀 3346·2019-08-29 13:55