在開(kāi)發(fā)新組件時(shí)測(cè)試出一個(gè)有趣的現(xiàn)象，現(xiàn)在記錄一下。

有一個(gè)完整的頁(yè)面組件Crud.vue及其props參數(shù)的配置文件ProductLabeling.js，使用vue-router的props傳值，能正常展示數(shù)據(jù)（如圖）。

創(chuàng)建一個(gè)File.vue的空白組件，包含Crud.vue，此時(shí)File組件沒(méi)有定義任何的props，但是props的值被傳遞給Crud.vue組件的props(如圖)。

File.vue,代碼如下：

測(cè)試其他情況：

1、在File.vue組件定義接收的props,會(huì)干擾往下傳播的props的值，但是不會(huì)阻斷這個(gè)行為（如圖）。

代碼如下：

2、修改template，增加一些其他顯示，完全阻斷這個(gè)現(xiàn)象（如圖）。

代碼如下：

這里貼一下路由的傳值方法

寫vue3也有一段時(shí)間，這個(gè)現(xiàn)象完全超出理解的范疇，感覺(jué)更像一個(gè)BUG。

當(dāng)然有時(shí)我們也想要這個(gè)功能把父組件的props完全傳遞到子組件，但是大部分時(shí)間我們都不需要。

通過(guò)dev-tool也確定了props數(shù)據(jù)的傳遞。使用vue-router傳值的props成為了File.vue組件的attrs,而往下傳遞給Crud.vue組件時(shí)，則是實(shí)打?qū)嵉耐ㄟ^(guò)props傳遞進(jìn)去。

可能template只有一個(gè)組件的情況下，衍生出一種類似繼承的關(guān)系吧（笑）。

網(wǎng)上搜索了一下也沒(méi)有找到相關(guān)的資料，只能單純記錄一下，如果有人能解釋這種傳值的邏輯歡迎留言討論。