vue中父子元件之間的通訊

2021-08-20 16:44:37 字數 761 閱讀 9753

父子元件通訊原則:1.父子元件是單向資料流,父元件狀態更新,子元件中prop狀態也會更新,但子元件的狀態變化不會影響父元件。在修改子元件的porp時,console會報錯。原因:防止子元件無意間修改父元件的狀態,避免資料流變得難以理解。———如果父元件傳遞給子元件的的狀態時物件

或者

陣列,因為兩者是按引用傳值,所以在子元件中可以改變物件或陣列的值,同時也會影響到父元件狀態。

1. 每次父元件狀態更新時,父元件中所有的雙向繫結model都會進行更新,同時子元件中的prop也會進行更新。父元件中更新的狀態,必須在父元件中進行雙向繫結,或者傳遞到子元件,才會觸發父元件的其他狀態更新。

父元件向子元件中傳參:

其一:通過porp傳遞資料

靜態傳遞

動態傳遞

傳入陣列

子元件中改變父元件的狀態有兩種方式:

其一:

通過事件派發,父元件相應子元件派發的事件,由父元件自己改變自己的狀態

其二:

父元件向子元件傳遞

陣列或物件

,在子元件中改變陣列或物件的狀態。

vue中父子元件之間的通訊

以前學期vue元件之間通訊的時候,頭痛,感覺好麻煩,結果今天遇到了,躲不掉了,所以今天就查了一下父子組價之間的通訊方法,小小總結一下 首先是,父元件向子元件傳遞變數 即子元件要呼叫父元件中的變數 有如下 在父元件中呼叫子元件,father variable為子元件要呼叫的變數 子元件內 這樣就可以呼...

vue中父子元件之間的通訊

父元件到子元件的通訊主要為 子元件接受使用父元件的資料,這裡的資料報括屬性和方法 string,number,boolean,object,array function vue提倡單項資料流,因此在通常情況下都是父元件傳遞資料給子元件使用,子元件觸發父元件的事件,並傳遞給父元件所需要的引數。父子通訊...

vue父子元件之間通訊

1 父元件向子傳遞引數 只需要在子元件內使用props即可獲取。2 子元件返回引數給父元件 子元件中設定 emit func data 父元件中直接取出func即可。注意 父元件向子元件傳參是單向的,若子元件直接修改父元件的引數,vue會報錯。如果需要修改,則有2種方式 方式一 在子元件中複製父變數...