2017-05-31 87 views
1

我想派發一個動作來使用當前登錄的用戶更新我的應用程序的全局狀態。當用戶點擊一個按鈕時,會觸發在mapDispatchToProps中註冊的事件處理程序,然後我想發送一個操作(article.updateAuthor(currentUser))。但是,在mapDispatchToProps中,我無法訪問獲取當前用戶的狀態,而且我也不想將當前登錄的用戶任意傳遞給組件prop - 僅傳遞給上面的click事件,然後通過將用戶數據發送到派發的操作。如何使用redux訪問mapDispatchToProps中的全局狀態?

我知道我可以派遣一個動作與一個redux thunk讓我訪問該州。然而,這看起來相當沉重,因爲沒有進行API調用。

有沒有人遇到過這個問題?

回答

4

在由react-redux提供的connect功能,您有四個可選參數,你可以使用:

  • mapStateToProps
  • mapDispatchToProps
  • mergeProps(此人會給你想你想)
  • options

從文檔mergeProps

如果指定,它被傳遞mapStateToProps()的結果, mapDispatchToProps(),和父道具。你從它返回的簡單對象將作爲道具傳遞給包裝組件。您 可以指定該功能基於 道具選擇狀態的片,或以行動創造者從道具

綁定到特定的變量所以你的情況,你會使用mapStateToProps訪問什麼的,直到永遠您需要的全球狀態。結果將作爲stateProps參數傳遞給mergeProps

mergeProps你所需要的與此狀態下做的,用的dispatchProps(或者從它解構dispatch)的結果,並返回你要連接到組件所需要的對象。

1

您可以考慮導入您的商店並使用store.getState(),這樣您就可以訪問您的「全球」商店。

但是請記住,如果您使用的是connect,則此方法無法重新調用,您應該使用@markerikson答案中建議的mergeProps

的getState()

返回應用程序的當前狀態樹。它等於商店減速器返回的最後一個值 。 Source

僞代碼:

import store from 'store' 
store.getState().yourReducer.user.current 
+0

根據http://redux.js.org/docs/faq/StoreSetup.html#store-setup-multiple-stores,這不是推薦方法。 – markerikson

+0

@markerikson感謝您的評論,我編輯了我的問題。 – GibboK

2

你不能。 mapDispatch故意無法訪問狀態,因爲您通常使用mapDispatch來創建綁定函數,並且基於狀態執行操作會不斷導致這些函數在狀態更改時重新創建。

如果你真的要做到這一點,你可以使用第三個參數connect,被稱爲mergeProps,但這通常只應作爲最後的手段。

推薦的方法是:

  • 提取相關數據mapState,並有組件調用this.props.someFunction(this.props.someRelatedValue)
  • 使用一個thunk和訪問有狀態

總體而言,訪問狀態在一個thunk中是一個完全有效且受支持的功能。有些人擔心這樣做是否是一個好主意,我在我的博客文章Idiomatic Redux: Thoughts on Thunks, Sagas, Abstraction, and Reusability中解決了這些問題。

+0

爲什麼'mergeProps'作爲最後的手段? Dan Abramov對使用thunk簡單訪問全球狀態提出了警告。你能解決這個問題嗎? 「不要濫用這種模式,當有緩存的數據可用時,它可以緩解API調用,但它不是一個很好的基礎來構建業務邏輯,如果你使用getState()只是有條件地調度不同的行動,考慮將業務邏輯放入減速器中。「 https://stackoverflow.com/questions/35411423/how-to-dispatch-a-redux-action-with-a-timeout/35415559 – robertjewell

+0

「mergeProps」最常見的用途是創建函數來關閉Redux狀態。然而,mergeProps會在每次狀態改變時重新運行,從而每次創建新的函數。這是創建函數時的性能問題,以及它們是新引用的事實,因爲這些會導致淺層次的平等檢查失敗(包括'PureComponent'和'shouldComponentUpdate')。至於丹的評論,我在我鏈接的博客文章中提到他們。 – markerikson

相關問題