摘要:在使用時(shí)避免不了子組件要調(diào)用父組件中定義的方法,官網(wǎng)給出了說明,可以調(diào)用父組件自定義的方法。輸入綁定上面代碼中使用了組件,自己寫的組件,在組件中直接使用調(diào)用它父級(jí)組件的方法會(huì)報(bào)錯(cuò),會(huì)提示你方法未定義。
在使用vue時(shí)避免不了子組件要調(diào)用父組件中定義的方法,vue官網(wǎng)給出了API說明,this.$parent可以調(diào)用父組件自定義的方法。
但是在使用UI組件時(shí)出現(xiàn)一個(gè)無法使用this.$parent直接調(diào)用父組件方法的問題。
上面代碼中使用了iview組件,TextTag自己寫的組件,在TextTag組件中直接使用this.$parent調(diào)用它父級(jí)組件的方法會(huì)報(bào)錯(cuò),會(huì)提示你方法未定義。
錯(cuò)誤的原因是因?yàn)槟阕约簩懙慕M件被包裹在iview組件中,所以你直接在TextTag組件中調(diào)用它父級(jí)方法是調(diào)用不到的,TextTag直接父級(jí)組件時(shí)iview中的Tabs,如果在這種情況下還想要調(diào)用父組件中的方法,可以使用:
this.$emit()
文章版權(quán)歸作者所有,未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為,您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請(qǐng)注明本文地址:http://systransis.cn/yun/108591.html
摘要:組件的通信和和內(nèi)置的通信手段一般有兩種給元素或組件注冊(cè)引用信息訪問父子實(shí)例。有時(shí)候兩個(gè)組件之間需要進(jìn)行通信,但是它們彼此不是父子組件的關(guān)系。詳情可參考參考組件之間種組件通信方式總結(jié)參考參考 組件的分類 常規(guī)頁(yè)面組件,由 vue-router 產(chǎn)生的每個(gè)頁(yè)面,它本質(zhì)上也是一個(gè)組件(.vue),主要承載當(dāng)前頁(yè)面的 HTML 結(jié)構(gòu),會(huì)包含數(shù)據(jù)獲取、數(shù)據(jù)整理、數(shù)據(jù)可視化等常規(guī)業(yè)務(wù)。 功能性抽...
摘要:組件基礎(chǔ)與通信一腳手架簡(jiǎn)介與安裝之前安裝的是模塊,之后安裝的是模塊。如果是三級(jí)組件通信,該如何處理比如父組件與孫子組件通信。和,提供和注入實(shí)現(xiàn)祖先組件和后代組件之間通信。 Vue組件基礎(chǔ)與通信 一、vue cli腳手架 ① vue cli 簡(jiǎn)介與安裝 vue cli 3.0之前安裝的是vue-cli模塊,vue cli 3.0之后安裝的是@vue/cli模塊。如果已經(jīng)全局安裝了舊版本的...
摘要:雖然和都可以獲取組件實(shí)例,但是它們無法在跨級(jí)或兄弟間通信,這是它們的缺點(diǎn)。也就是在父組件中提供一個(gè)值,并且在需要使用的子孫組件中注入改值,即不僅僅是,只要是的子組件,無論隔多少代,都可以通過這個(gè)的方式注入。通過混入組件,實(shí)現(xiàn)組件間的通信。 寫在前面 vue 的組件化應(yīng)該是其最核心的思想了,無論是一個(gè)大的頁(yè)面還是一個(gè)小的按鈕,都可以被稱之為組件。基于 Vue 的開發(fā),就是在寫一個(gè)個(gè)組件,...
摘要:本文總結(jié)了組件間通信的幾種方式,如和,以通俗易懂的實(shí)例講述這其中的差別及使用場(chǎng)景,希望對(duì)小伙伴有些許幫助。狀態(tài)改變提交操作方法。 前言 組件是 vue.js最強(qiáng)大的功能之一,而組件實(shí)例的作用域是相互獨(dú)立的,這就意味著不同組件之間的數(shù)據(jù)無法相互引用。一般來說,組件可以有以下幾種關(guān)系:showImg(https://segmentfault.com/img/remote/146000001...
摘要:使,最主要的的是跨組件通信全局?jǐn)?shù)據(jù)維護(hù)。這兩種法旦發(fā)出事件后,任何組件都是可以接收到的,就近原則,且會(huì)在第次接收到后停冒泡,除返回。并且和也沒有解決兄弟組件間的通信問題。 Vue的組件是其非常重要的系統(tǒng),組件之間的通信也是開發(fā)中不可避免的需求 一般來說Vue組件是以下幾種關(guān)系 showImg(https://segmentfault.com/img/bVbrrTY); A組件和B組件、...
閱讀 2272·2021-08-23 09:46
閱讀 921·2019-08-29 18:31
閱讀 1872·2019-08-29 17:04
閱讀 2464·2019-08-29 12:23
閱讀 1860·2019-08-26 14:05
閱讀 1085·2019-08-26 13:44
閱讀 3154·2019-08-26 12:23
閱讀 2207·2019-08-26 10:46