我的react.js/node.js應用程序存在問題。我在我的應用中使用了React-routers,並且有非常糟糕的錯誤。如何解決React Router'意外令牌<'錯誤?
Index route works, everything is fine.
Routes like "/something" also work
但像 「/某事/某事」 的路線不工作:
(下一頁圖像在評論這個問題)
[當我第一次加載此頁時] [3]
[當我重新載入頁面] [4]
我的代碼: 的index.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Boox</title>
<meta name="theme-color" content="teal">
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<link rel="stylesheet" href="http://fonts.googleapis.com/icon?family=Material+Icons" />
<link type="text/css" rel="stylesheet" href="./plugins/css/normalize.css" />
<link type="text/css" rel="stylesheet" href="./plugins/css/animate.css" />
<link type="text/css" rel="stylesheet" media="screen, projection" href="./plugins/materialize/css/materialize.min.css" />
</head>
<body>
<div id="root">
</div>
<script src="./plugins/js/jquery.js"></script>
<script src='./plugins/materialize/js/materialize.min.js'></script>
<script src="./dist/bundle.js"></script>
</body>
index.js:
import React, {Component} from 'react';
import ReactDOM from 'react-dom';
import {Router, Route, Link, browserHistory, IndexRoute} from 'react-router'
import App from './App.js';
import Main from './components/Main.js';
import NotFound from './components/NotFound.js';
import Users from './components/user/Users.js';
import Profile from './components/user/Profile.js';
// components
import Signup from './components/user/auth/Signup.js';
import Signin from './components/user/auth/Signin.js';
import Editor from './components/user/write/Editor.js';
import Write from './components/user/write/Write.js';
// styles
require('./less/common.less');
ReactDOM.render((
<Router history={browserHistory}>
<Route path="/" component={App}>
<IndexRoute component={Main} />
<Route path="signup" component={Signup} />
<Route path="signin" component={Signin} />
<Route path="write" component={Write}>
<Route path=":id" component={Editor} /> // This doesnot work :(
</Route>
<Route path="users" component={Users}>
<Route path=":id" component={Profile} /> // This doesnt work :(
</Route>
</Route>
<Route path=":id" component={NotFound} />
</Router>
), document.getElementById('root'))
Users.js:
import React, {Component} from 'react';
import {Router, Route, Link, browserHistory, IndexRoute} from 'react-router'
export default class Users extends Component {
constructor() {
super()
this.state = {
}
}
render() {
return (
<div>
<h1>TEST USERS ROUTE</h1>
{this.props.children}
</div>
)
}
}
個
Server.js也含有這樣的:
app.get('*', (req, res) => {
res.sendFile(path.resolve(__dirname, 'index.html'));
})
我會很高興的任何建議。謝謝。
[3]:https://i.stack.imgur.com/2Qz7R.png [4]:https://i.stack.imgur.com/PLgsD.png [5]:https:/ /i.stack.imgur.com/g8cxZ.png [6]:https://i.stack.imgur.com/Z765B.png [7]:https://i.stack.imgur.com/wIRlv .png –
請不要將代碼/錯誤/其他文本作爲圖像發佈。當圖片鏈接停止時,上下文丟失。此外,無論如何,圖像都不能從谷歌搜索文本,例如。 – mscdex