近期學習 vue3 的父子組件之間的傳值，發現跟 vue2.x的父子組件之間的傳值 并沒有太大的區別，我這邊總結一下，希望對大家有所幫助。

一、父組件向子組件傳值
??父組件向子組件傳值的時候，子組件是通過props來接收的，如果在子組件中要放到setup函數中使用的話，就要先通過props接收到傳遞過來的參數，然后以變量的形式將props傳遞到setup函數中使用。如下圖所示：

1、父組件傳遞方式

1.png

2、子組件接收方式和使用

2.png

3、效果圖

3.png

二、子組件向父組件傳值
??vue3中子組件向父組件傳遞值和vue2.x的區別是vue2.x使用的是 emit('方法名','傳遞的值(根據需要傳或者不傳)')，vue3的是 emit('方法名','傳遞的值(根據需要傳或者不傳)')。vue3的子傳父方式如下圖所示：

1、子組件的傳遞方式

4.png

2、父組件接收與使用

5.png

3、效果圖

6.png

————————————————
版權聲明：本文為CSDN博主「紫菀檀ss」的原創文章，遵循CC 4.0 BY-SA版權協議，轉載請附上原文出處鏈接及本聲明。
原文鏈接：https://blog.csdn.net/LiaoFengJi/article/details/120013255