migrieren react-router v2 zu v4 onGeben Sie Argumente ein

Question

Ich migriere eine App (nicht von mir geschrieben) von react-router v2 nach v4.

Der alte v2-Code sieht wie folgt aus:

<Route path="/configurations/:id" onEnter={loadConfiguration}> 
    // some stuff 
</Route> 

Der neue v4 Code wie folgt aussieht:

<Route path="/configurations/:id" component={MyComponent}> 
    // some stuff 
</Route> 

export default class MyComponent extends Component { 
    componentDidMount() { 
    loadConfiguration() 
    } 
    // render method, etc 
} 

Das Problem ist, dass in v2 die loadConfiguration Funktion mit 3 params genannt wird - nextstate , ersetzen, Rückruf

Im v4-Code wird die loadConfiguration-Funktion mit 0 params aufgerufen.

Wie übergebe ich bei der Migration von v2 nach v4 die gleichen Werte in loadConfiguration?

Answer 1

können Sie verwenden machen Requisiten, um Ihre Komponente zu übergeben:

<Route path="/configurations/:id" render={ 
() => <MyComponent nextState={ nextState } replace={ replace } callback={ callback } /> 
} /> 

Und dann in der Komponente:

export default class MyComponent extends Component { 

    loadConfiguration() { 
    ... 
    } 

    componentDidMount() { 
    this.loadConfiguration(this.props.example, this.props.replace, this.props.callback) 
    } 

    // render method, etc 

} 

Sie könnten auch die loadConfiguration Funktion von der Mutter überliefern als Prop, wenn nötig, und dann rufen Sie es in Ihrer Komponente als this.props.loadConfiguration()

---

Hinweis: Sie können auch Requisiten aus dem Mutterpass:

<Route path="/configurations/:id" render={ 
    (props) => <MyComponent example={ props.example } /> 
} />