重新初探vue(三),父子組件的傳值

使用vue就會用到組件,那麼對於公用的組件,就會牽涉到組件之間傳值的問題。

首先新建兩個文件,一個child頁面做爲子組件,一個index頁面做爲父組件

clipboard.png

clipboard.png

  1. 當新建完成之後,我們從 父組件傳遞值到子組件 開始

首先在父組件中

clipboard.png

在子組件中

clipboard.png

最終的效果

clipboard.png
emmm,這只是個梨子,沒有任何實際作用。。。。。

2 . 接下來就是 子組件向父組件傳值

在子組件中

clipboard.png

clipboard.png

最終的渲染結果
clipboard.pngyou

寫在尾巴上,看到代碼中$emit與$on會經常出現,那麼爲啥子嘛。
使用他們兩個之前,首先你要在main.js的文件中重新聲明一個vue

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章