Open
Description
As a beginner, it is really confusing how to construct links in the DOM. The example in the README is incomplete without a working example of links. I have tried using createHref
after doing a lot of searching, but it is not working and I am getting an error like this:
TypeError: Cannot read property '_namespace' of undefined
at RouterSource.createHref (VM986 bundle.js:3568)
at HomeComponent (VM986 bundle.js:3432)
at MapOp.f (VM986 bundle.js:3562)
at _try (VM986 bundle.js:17778)
My example source code:
import xs from 'xstream';
import { run } from '@cycle/run';
import { makeDOMDriver, div, p, a } from '@cycle/dom';
import { routerify } from 'cyclic-router';
import { makeHistoryDriver } from '@cycle/history';
import switchPath from 'switch-path';
function HomeComponent(sources) {
const { router: { createHref }} = sources;
const aboutLink = createHref('/about');
const vdom$ = xs.of(false).map(() => div([
p('Home page'),
a({ attrs: { href: aboutLink }}, 'About')
]));
return {
DOM: vdom$
}
}
function AboutComponent(sources) {
const vdom$ = xs.of(false).map(() => div([
p('About page')
]));
return {
DOM: vdom$
}
}
function main(sources) {
const pageSink$ = sources.router.routedComponent({
'/': HomeComponent,
'/about': AboutComponent
})(sources);
return {
DOM: pageSink$.map(c => c.DOM).flatten(),
router: xs.of('/')
};
}
const mainWithRouting = routerify(main, switchPath);
run(mainWithRouting, {
DOM: makeDOMDriver('#app'),
history: makeHistoryDriver()
});
Metadata
Metadata
Assignees
Labels
No labels