首页
/
每日頭條
/
科技
/
vue 3.0父組件調用子組件的方法
vue 3.0父組件調用子組件的方法
更新时间:2025-07-10 23:44:17

我們都知道在vue中父組件向子組件傳參需要在組件使用的位置使用屬性綁定的方式,然後在子組件中通過props接收父組件中傳遞過來的數據,如果涉及到多層組件嵌套我們需要涉及到好多次屬性綁定和好多次props接收數據,導緻代碼維護較差,我們知道可以借助vuex實現狀态管理,今天我們來使用一下在vue3中提供的provide和inject來實現數據的傳遞.

我們定義一個父組件father.vue,定義一個子組件son.vue,将子組件挂載給父組件

vue 3.0父組件調用子組件的方法(vue3多層嵌套組件如何訪問到最外層組件的數據)1

同時我們在父組件中定義了一個數據叫result,使用provide将數據暴露屬性為msg,值是result變量存儲的變量’father’字符串,我們并沒有在子組件的使用位置使用屬性綁定的方式傳遞參數,接下來我們來看子組件的代碼

vue 3.0父組件調用子組件的方法(vue3多層嵌套組件如何訪問到最外層組件的數據)2

在子組件内部我們按需導入inject,并去接收父組件提供的屬性msg,使用變量m保存,并将mreturn,在結構位置使用插值表達式{{m}} m展示的信息為’father’字符串。

,
Comments
Welcome to tft每日頭條 comments! Please keep conversations courteous and on-topic. To fosterproductive and respectful conversations, you may see comments from our Community Managers.
Sign up to post
Sort by
Show More Comments
推荐阅读
武神技能柔化順序
武神技能柔化順序
武神技能柔化順序?為什麼武神的加點會這麼遲來呢,因為這次改版有個别技能減少了SP消耗,多玩的加點器沒更新,所以我得手動搞下得等更新遊戲,我來為大家科普一下關于武神技能柔化順序?以下内容希望對你有幫助!武神技能柔化順序為什麼武神的加點會這麼遲...
2025-07-10
ps的去色工具在哪啊
ps的去色工具在哪啊
大家好,本章為大家帶來一節照片去除灰的小實例。使用到的工具是“色階”。我們平時拍攝的數碼照片中,由于光線和數碼相機特性的原因,經常會感覺照片灰蒙蒙的,不通透,這就是照片灰階比較大了。在相機的液晶屏上,看着蠻好的,一旦導入到電腦上查看,就出問...
2025-07-10
聯想怎麼錄屏快捷鍵
聯想怎麼錄屏快捷鍵
聯想電腦怎麼錄屏?很多作為全球第一大個人電腦商,旗下有很多電腦品牌,這也成為了很多大學生和職場打工人的首選。聯想電腦功能強大,可以滿足我們日常的辦公和學習需求,而且隻要是win10以上的電腦系統還會有遊戲錄屏功能,很多不是計算機專業的人可能...
2025-07-10
ios系統快速注銷
ios系統快速注銷
iPhone用久了,難免會出現一些小問題,通常我們隻要重啟或注銷設備,就能解決90%的小問題。今天,跟大家分享一個通過iOS12的捷徑,來添加一個指令,實現一鍵注銷的功能。需要注意的是:不适用于iOS12.2beta系統。不要把它添加到Si...
2025-07-10
cad常用指令
cad常用指令
《實用技巧300條》第7篇|原創:就說我在開發區CAD中的ET工具全稱EXPRESSTOOLS,中文直譯為快捷工具,從AutoCAD2006版開始推出,因為一直沒有進行漢化,所以也影響了它的推廣。ET工具是好用到飛起的擴展工具,對于CAD的...
2025-07-10
Copyright 2023-2025 - www.tftnews.com All Rights Reserved