Ich bin neu im React-Redux-Ökosystem und lerne, indem ich einfache Anwendungen ausprobiere. In diesem Fall probiere ich aus, wie Routing in der react-redux-Anwendung funktioniert. Im Grunde ist die Idee:
Hier ist mein Code
%Vor%}
Die Anwendung baut gut auf und es kommt gut, aber wenn ich auf den Link klicke, funktioniert es nicht.
Siehe Screenshot der laufenden Anwendung
Gesucht und gelesen verschiedene Beiträge, aber ich konnte das Grundproblem nicht lokalisieren.
Dein Code scheint korrekt zu sein, aber es gibt eine einfache Sache, die du vermisst: du renderst nicht das "Kind" deines Routers! :)
Sie können das hier überprüfen:
Immer wenn Sie eine Komponentenroute (die mit </Route path="application-path" component={MyComponent} /> deklarierte deklarieren möchten), müssen Sie angeben, wo sie platziert werden soll. Wenn Sie react-router verwenden, geben Sie dies mithilfe der Property children an. Wenn React dann diese Requisite "sieht", werden die Routen angezeigt (es kann auch eine verschachtelte Route sein).
Um also Ihren Code zu reparieren, muss Ihre App -Komponente korrekt mit this.props.children umgehen. So ähnlich:
Wenn Sie nun auf die Route "/ foo" tippen, wird this.props.children durch Foo component ersetzt.
Übrigens brauchen Ihre verschachtelten Routen (die innen) keine "/", da sie "vorangestellt" werden. Dies ist die Art wie reac-router verschachtelte Routen darstellt.
Ich denke, das ist es, viel Glück damit! :)
Tags und Links react-redux
