我的/
路线无法正确呈现我的主要组件。
这是我的代码:
ReactDOM.render(
<Router history={browserHistory}>
<Route path="/" componenet={Main}>
<IndexRoute component={Index}></IndexRoute>
<Route path="portfolio" component={Portfolio}></Route>
</Route>
</Router>,
document.getElementById('app')
);
这是我的主要组件:
export default class Main extends React.Component {
render() {
console.log("asdfasfsaf");
return(
<div>
<h1> This is Main Page </h1>
{this.props.children}
</div>
)
}
}
一旦我加载这个网站,它就会转到我的Index
成分。但是它不会渲染 <h1> This is Main Page </h1>
的Main.js
。然后我彻底删除了Main.js
中的所有代码并重新加载,发现它仍然运行,没有任何错误。有谁知道这个问题的解决方案吗?
最佳答案
您这里有一个拼写错误 <Route path="/" componenet={Main}>
它的组件
ReactDOM.render(
<Router history={browserHistory}>
<Route path="/" component={Main}>
<IndexRoute component={Index}></IndexRoute>
<Route path="portfolio" component={Portfolio}></Route>
</Route>
</Router>,
document.getElementById('app')
);
和
export default class Main extends React.Component {
constructor(props) {
super(props)
}
render() {
console.log("asdfasfsaf");
return(
<div>
<h1> This is Main Page </h1>
{this.props.children}
</div>
)
}
}
关于javascript - React JS 路由无法正常工作,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/38599276/