我安装了所有正确的依赖项(在这里做出反应和反应路由器),我使用的是React Router Github页面中最基本的例子......但是我无法摆脱这个错误。
我的React路由器是@ 0.13.3& React也是0.13.3。
这是我的代码,在JSX中:
import "../css/master.scss";
import React from 'react';
import { Router, Route, Link } from 'react-router';
const App = React.createClass({
render() {
return (
<div>
<h1>App</h1>
<ul>
<li>
<Link to="about">About</Link>
</li>
</ul>
{this.props.children}
</div>
)
}
})
const About = React.createClass({
render() {
return <h3>About</h3>
}
})
const Contact = React.createClass({
render() {
return <h3>Contact</h3>
}
})
const routes = {
path: '/',
component: App,
childRoutes: [
{ path: 'about', component: About },
{ path: 'contact', component: Contact },
]
}
React.render(<Router routes={routes} />, document.getElementById('app'));
答案 0 :(得分:0)
我更改了我的最终语句以匹配Router.run()然后渲染了我的React组件。在React-Router的快速介绍中没有看到这一点。
抱歉StackOverflow V_V
import "../css/master.scss";
import React from 'react';
import Router, { Route, Link } from 'react-router';
const App = React.createClass({
render() {
return (
<div>
<h1><Link to="/">App</Link></h1>
<ul>
<li><Link to="about">About</Link></li>
<li><Link to="contact">Contact</Link></li>
</ul>
{this.props.children}
</div>
)
}
})
const About = React.createClass({
render() {
return <h3>About</h3>
}
})
const Contact = React.createClass({
render() {
return <h3>Contact</h3>
}
})
const AppRoutes = (
<Route path="/" handler={App}>
<Route name="about" handler={About} />
<Route name="contact" handler={Contact} />
</Route>
);
Router.run(AppRoutes, Router.HashLocation, (Root) => {
React.render(<Root />, document.getElementById('app'));
});