@@ -11,7 +11,7 @@ creating a cycle indirectly.
11
11
12
12
` router.js -> routes.js -> SomeComponent.js -> actions.js -> router.js `
13
13
14
- To avoid this, you can do one of two things:
14
+ To avoid this, you can do one of three things:
15
15
16
16
1 . Send the component to the action, think of it like ` event.target ` in
17
17
DOM events if it bothers you.
@@ -56,6 +56,67 @@ To avoid this, you can do one of two things:
56
56
}
57
57
` ` `
58
58
59
+ 3. Proxy calls to ` router` instance and export the proxy early so action creators can ` require` it .
60
+
61
+ ` ` ` js
62
+ // router.js
63
+ // The trick is to assign module.exports before any require()s
64
+
65
+ var router;
66
+
67
+ module.exports = {
68
+ getCurrentPath() {
69
+ return router.getCurrentPath();
70
+ },
71
+
72
+ makePath(to, params, query) {
73
+ return router.makePath(to, params, query);
74
+ },
75
+
76
+ makeHref(to, params, query) {
77
+ return router.makeHref(to, params, query);
78
+ },
79
+
80
+ transitionTo(to, params, query) {
81
+ router.transitionTo(to, params, query);
82
+ },
83
+
84
+ replaceWith(to, params, query) {
85
+ router.replaceWith(to, params, query);
86
+ },
87
+
88
+ goBack() {
89
+ router.goBack();
90
+ },
91
+
92
+ run(render) {
93
+ router.run(render);
94
+ }
95
+ };
96
+
97
+ // By the time route config is require()-d,
98
+ // require('./router') already returns a valid object
99
+
100
+ var routes = require('./routes'),
101
+ Router = require('react-router');
102
+
103
+ router = Router.create({
104
+ routes: routes,
105
+ location: Router.HistoryLocation
106
+ });
107
+ ` ` `
108
+
109
+ and then in your ` ActionCreators.js`
110
+
111
+ ` ` ` js
112
+ var router = require('./router');
113
+ exports.doStuff = (payload) => {
114
+ // stuff
115
+ router.transitionTo(...);
116
+ }
117
+ ` ` `
118
+
119
+
59
120
Handling route changes as actions
60
121
-------------------------------- -
61
122
0 commit comments