當前位置:成語大全網 - 新華字典 - Vue3 組件傳值 props 和 attrs 區別

Vue3 組件傳值 props 和 attrs 區別

區別如下:

1、props 要先聲明才能取值,attrs 不用先聲明

2、props 聲明過的屬性,attrs 裏不會再出現

3、props 不包含事件,attrs 包含

4、props 支持 string 以外的類型,attrs 只有 string 類型

在父組件中我傳了三個事件壹個屬性,在子組件中分別將 props 和 attrs 的值打印出來:

結果顯示 props 是壹個空對象,而 attrs 中包含了所有父組件傳遞的方法和屬性

將 size 屬性在 props 中進行聲明,再執行打印,果然 size 屬性出現在了 props 對象中,而 attrs 中這次卻沒有再體現:

接下來我們在父組件中增加壹個值為 Boolean 的屬性

看到出現在 attrs 中的 disabled 是壹個 值為空字符串的屬性:

我們在 props 中聲明 disabled 為 Boolean 類型:

重新打印結果: