1
1
# cyclic-router
2
2
cyclic-router is a Router Driver built for Cycle.js
3
3
4
- ** Disclaimer** v2.x.x is for Cycle Diversity!
4
+ ** Disclaimer** v2.x.x and v3 are for Cycle Diversity!
5
5
If you are still using @cycle/core please continue to use v1.x.x
6
6
7
7
## Installation
8
8
9
9
Using [ npm] ( https://www.npmjs.com/ ) :
10
10
11
- $ npm install cyclic-router
11
+ $ npm install --save cyclic-router
12
+
13
+ Version 3 requires users to inject the route matcher. We'll use ` switch-path ` for our examples but other
14
+ matching libraries could be adapted to be used here:
15
+
16
+ $ npm install --save switch-path
17
+
18
+ Note: Version 2 and below use ` switch-path ` for the route matcher always and the above library install is not necesssary/done implicitly.
12
19
13
20
Then with a module bundler like [ browserify] ( http://browserify.org/ ) , use as you would anything else:
14
21
@@ -22,7 +29,7 @@ var makeRouterDriver = require('cyclic-router').makeRouterDriver
22
29
23
30
## API
24
31
25
- For API documentation pleave visit this link [ here] ( http://cyclejs-community.github.io/cyclic-router/docs/ )
32
+ For API documentation please visit this link [ here] ( http://cyclejs-community.github.io/cyclic-router/docs/ )
26
33
27
34
## Basic Usage
28
35
@@ -32,6 +39,7 @@ import Cycle from '@cycle/xstream-run';
32
39
import {makeDOMDriver } from ' @cycle/dom' ;
33
40
import {makeRouterDriver } from ' cyclic-router' ;
34
41
import {createHistory } from ' history' ;
42
+ import switchPath from ' switch-path' ; // Required in v3, not required in v2 or below
35
43
36
44
function main (sources ) {
37
45
const match$ = sources .router .define ({
@@ -53,13 +61,14 @@ function main(sources) {
53
61
54
62
Cycle .run (main, {
55
63
DOM : makeDOMDriver (' #app' ),
56
- router: makeRouterDriver (createHistory ())
64
+ router: makeRouterDriver (createHistory (), switchPath) // v3
65
+ // router: makeRouterDriver(createHistory()) // <= v2
57
66
});
58
67
```
59
68
60
69
### Route Parameters
61
70
62
- You can pass route parameters to your component by adding them to the component sources.
71
+ This behavior changes based on the injected route matcher. In the case of ` switch-path ` , you can pass route parameters to your component by adding them to the component sources.
63
72
64
73
``` js
65
74
const routes = {
0 commit comments