將道具傳遞給react-redux容器組件

我有一個在React Native Navigator組件中創建的react-redux容器組件。我希望能夠將導航器作爲道具傳遞給此容器組件，以便在其演示組件內按下按鈕後，它可以將對象壓入導航器堆棧。將道具傳遞給react-redux容器組件

我想要這樣做，而不需要手工編寫react-redux容器組件給我的所有樣板代碼（並且也不會錯過所有反應的優化 - redux也會給我這裏）。

例容器組件代碼：

const mapStateToProps = (state) => { 
    return { 
     prop1: state.prop1, 
     prop2: state.prop2 
    } 
} 

const mapDispatchToProps = (dispatch) => { 
    return { 
     onSearchPressed: (e) => { 
      dispatch(submitSearch(navigator)) // This is where I want to use the injected navigator 
     } 
    } 
} 

const SearchViewContainer = connect(
    mapStateToProps, 
    mapDispatchToProps 
)(SearchView) 

export default SearchViewContainer

而且我希望能夠從我的導航renderScene函數中調用這樣的組件：

<SearchViewContainer navigator={navigator}/>

在集裝箱上面的代碼，我需要能夠從mapDispatchToProps函數中訪問通過的prop。

我不喜歡在redux狀態對象上存儲導航器，並且不想將prop傳遞給表示組件。

有沒有一種方法可以將道具傳遞給這個容器組件？或者，有沒有其他方法可以忽略？

謝謝。

來源

2016-06-12 Michael

mapStateToProps和mapDispatchToProps都採取ownProps作爲第二個參數。

[mapStateToProps(state, [ownProps]): stateProps] (Function): 
[mapDispatchToProps(dispatch, [ownProps]): dispatchProps] (Object or Function):

對於reference

來源

2016-06-13 09:36:04

您可以在第二個參數傳遞給mapStateToProps(state, ownProps)，這將給你訪問傳遞到組件的道具mapStateToProps

來源

2016-06-12 22:40:01

如何在mapDispatchToProps中訪問它？ – Michael

@Michael以同樣的方式，你可以使用第二個參數 –

如果使用的是裝飾，下面的代碼給你想要使用的裝飾爲您Redux的連接情況的一個例子。

@connect(
    (state, ownProps) => { 
     return { 
      Foo: ownProps.Foo, 
     } 
    } 
) 
export default class Bar extends React.Component {

如果您現在檢查this.props.Foo你會看到，從使用了Bar部件，其中添加的道具。

<Bar Foo={'Baz'} />

在這種情況下this.props.Foo將字符串「巴茲」

希望這澄清了一些事情。

來源

2018-01-24 10:02:14

將道具傳遞給react-redux容器組件

回答

相關問題