到底用prop還是事件

harryhappy 發(fā)布于2019-08-20 11:19 / 3050人閱讀

摘要：組件之間數(shù)據(jù)交互，主要有和事件兩種。如果所對應(yīng)的任務(wù)是在父組件完成的，父組件需要將拿到的一堆數(shù)據(jù)傳給時，這時可以通過事件來傳遞。

組件之間數(shù)據(jù)交互，主要有prop和事件兩種。

prop

事件

那如何優(yōu)雅的選擇呢？
筆者覺得可以在數(shù)據(jù)功能上進(jìn)行區(qū)分。
比如上面的場景，是由于子組件child在知道id改變后，在它自己的作用域里去執(zhí)行handler()方法，handler可能是一個需要ajax獲取數(shù)據(jù)并渲染到child組件上的函數(shù)(ajax在child組件中完成的)，這時候就推薦用watch來監(jiān)聽id的改變了。
如果handler所對應(yīng)的ajax任務(wù)是在父組件完成的，父組件需要將拿到的一堆json數(shù)據(jù)傳給child時，這時可以通過事件來傳遞。

參考

Vue+Webpack使用規(guī)范

云服務(wù)器 GPU云服務(wù)器云服務(wù)器到底干什么用 prop() props prop

文章版權(quán)歸作者所有，未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請注明本文地址：http://systransis.cn/yun/80507.html

相關(guān)文章

VUE防抖與節(jié)流的最佳解決方案——函數(shù)式組件

摘要：案例持續(xù)觸發(fā)事件時，并不立即執(zhí)行函數(shù)，當(dāng)毫秒內(nèi)沒有觸發(fā)事件時，才會延時觸發(fā)一次函數(shù)。也以函數(shù)形式暴露普通插槽。這樣的場景組件用函數(shù)式組件是非常方便的。相關(guān)閱讀函數(shù)式組件自定義指令前言有echarts使用經(jīng)驗的同學(xué)可能遇到過這樣的場景，在window.onresize事件回調(diào)里觸發(fā)echartsBox.resize()方法來達(dá)到重繪的目的，resize事件是連續(xù)觸發(fā)的這意味著echarts...

OldPanda 2019-05-22 19:08 評論0 收藏0
詳解vue組件三大核心概念

摘要：前言本文主要介紹屬性事件和插槽這三個基礎(chǔ)概念使用方法及其容易被忽略的一些重要細(xì)節(jié)。至于如何改變，我們接下去詳細(xì)介紹單向數(shù)據(jù)流這個概念出現(xiàn)在組件通信。比如上例中在子組件中修改父組件傳遞過來的數(shù)組從而改變父組件的狀態(tài)。的一個核心思想是數(shù)據(jù)驅(qū)動。前言本文主要介紹屬性、事件和插槽這三個vue基礎(chǔ)概念、使用方法及其容易被忽略的一些重要細(xì)節(jié)。如果你閱讀別人寫的組件，也可以從這三個部分展開，它們...

rickchen 2019-08-23 17:51 評論0 收藏0
淺析React之事件系統(tǒng)（一）

摘要：合成事件的使用方式在中不會把所有的事件處理器綁定到相應(yīng)的真實的節(jié)點上，而是使用一個統(tǒng)一的事件監(jiān)聽器，把所有的事件綁定在最外層。在之前開發(fā)者需要為了優(yōu)化性能需要自己來優(yōu)化自己的事件處理器的代碼，現(xiàn)在幫助你完成了這些工作。大家周末好，2016年的最后幾篇文章開始寫到了React的一些東西，那么最近就來一些圖表君對于React的簡單總結(jié)和理解，那么今天就開始第一篇，說一說React的事件系...

chemzqm 2019-08-20 14:05 評論0 收藏0
[源碼閱讀]通過react-infinite-scroller理解滾動加載要點

摘要：看它的源碼主要意義不在知道如何使用它，而是知道以后處理滾動加載要注意的東西。通過判斷不為的情況，確保滾動組件正常顯示和在無滾動的情況下，和相等，都為在有滾動的情況下，表示實際內(nèi)容高度，表示視口高度。 react-infinite-scroller就是一個組件，主要邏輯就是addEventListener綁定scroll事件。看它的源碼主要意義不在知道如何使用它，而是知道以后處理滾動加...

cikenerd 2019-08-23 13:41 評論0 收藏0
高階組件HOC - 小試牛刀

摘要：因為這個高階函數(shù)，賦予了普通組件一種呼吸閃爍的能力記住這句話，圈起來重點考。其實，高階組件就是把一些通用的處理邏輯封裝在一個高階函數(shù)中，然后返回一個擁有這些邏輯的組件給你。原文地址：https://github.com/SmallStoneSK/Blog/issues/6 1. 前言老畢曾經(jīng)有過一句名言，叫作國慶七天樂，Coding最快樂~。所以在這漫漫七天長假，手癢了怎么辦？于是...

lookSomeone 2019-08-23 12:14 評論0 收藏0