vue的父與子元件的訪問

2022-09-18 21:12:13 字數 509 閱讀 2491

父訪問子  (需要掌握)

this.$children 和 this.$refs  

this.$children 返回的是乙個陣列,包含父元件的所有子元件  this,$refs 返回的是乙個物件,預設為空,返回父元件中所有標籤帶有ref屬性的子元件

this.$children 是獲取父元件的所有子元件,然後返回乙個陣列  (不常用)

this.$refs 則是通過給 元件標籤上 加上乙個 ref屬性,然後在父元件中呼叫 this.$refs時才會返回 乙個物件  (常用,用的非常多 基本都是用這個)

例如  子元件標籤    通過this.$refs 他就會返回乙個物件 而mm就作為乙個key,我們通過this.$refs.mm 就能拿到這個元件,之後就可以拿到具體的值了

訪問父   (不常用)

this.parent 訪問父元件   this.root 訪問根元件   (都用得少)

vue 子元件與父元件的通訊

子元件調父元件的方法 在子元件中通過this.parent.event通過 emit觸發乙個事件,父元件監聽這個事件 通過prop傳入父元件的方法 父元件 home.vue 子元件 helloworld.vue 通過 this.parent.event 呼叫父元件的方法 通過 emit 觸發乙個事件...

vue 父元件與子元件的互動

我們在進行vue開發時會將公共的部分進行抽象,然後生成乙個獨立的元件,這個元件可以被其它頁面引用,如果希望有互動的動作就設計到了值的傳遞,或者方法的 等問題,這一次我們主要來說一下父元件和子元件的互動。子元件,通過定義了prods,然後可以實現從父元件向子元件的傳遞 呼叫父元件的方法 父元件 頁面,...

VUE 父元件與子元件互動

在專案過程中,會有很多重複功能在多個頁面中處理,此時則需要把這些重複的功能進行單獨拎出,編寫公用元件 控制項 進行引用。在vue中,元件是可復用的vue例項,此時元件中的data必須是乙個函式,因為data是乙個函式時,每次引用此元件時相當於重新對返回物件進行獨立的拷貝 例項化 new 如果data...