Zugriffsrequisiten, die zusammen mit Redux-Statusdaten an Komponenten gesendet werden

Question

Normalerweise können Sie auf Requisiten zugreifen, die von übergeordneten an untergeordnete Elemente der untergeordneten Komponente gesendet werden. Aber wenn Reduction auf Kindkomponenten verwendet wird, gehen die Requisiten, die von Eltern gesendet werden, verloren mit der Verwendung der 'Verbindungs'-Methode, die den Redux-Zustand mit Komponenten-Requisiten abbildet.

ZB:

eine Komponente mit Eigenschaften deklarieren: <A_Component prop1='1' prop2='2' />

ohne redux Zugriff auf untergeordnete Komponente, funktioniert gut: this.props.prop1 oder this.props.prop2

Gleiche Aussagen undefined Fehler geben, wenn redux Staaten benutzt.

Answer 1

eigene Komponente Stützen sind als zweites Argument der Funktion mapStateToProps:

// ParentComponent.js 

// ... other component methods ... 
render() { 
    return <TodoContainer id="1" /> 
} 

// TodoContainer.js 

// `ownProps` variable contains own component props 
function mapStateToProps(state, ownProps) { 
    return { 
    todo: state.todos[ownProps.id] 
    }; 
} 

Answer 2

reagieren-redux connect method Requisiten auf das Element gewickelt gibt. Die Verbindungsmethode kann 3 Methoden erhalten:

• mapStateToProps -
• mapDispatchToProps die Daten Requisiten erstellen - die Aktionen Requisiten
• mergeProps - kombinieren, die von den 2 bisherigen Methoden hergestellten Stützen, und fügt die übergeordnete assign Requisiten (eigeneProps/parentProps).

Regel außer Kraft setzen Sie nur die mapStateToProps und oder mapDispatchToProps, und verwenden Sie den Standard mergeProps (defaultMergeProps).

Dies ist die Definition von defaultMergeProps Methode:

const defaultMergeProps = (stateProps, dispatchProps, parentProps) => ({ 
    ...parentProps, // ownProps 
    ...stateProps, // mapStateToProps 
    ...dispatchProps // mapDispatchToProps 
}) 

Also, wenn Sie defaultMergeProps durch eigene mergeProps Methode überschreiben, werden Sie immer die Requisiten von den Eltern zugewiesen bekommen.

btw - beide mapStateToProps und mapDispatchToProps erhalten auch OwnProps, damit sie diese mit dem Status kombinieren und neue Datenrequisiten/Aktionsrequisiten erstellen können.