gpt4 book ai didi

javascript - 获取解析错误

转载 作者:塔克拉玛干 更新时间:2023-11-02 22:46:54 25 4
gpt4 key购买 nike

知道如何得到react-router使用 ReactJS?

它在我的浏览器控制台中抛出错误。我的代码如下。我安装了npm react-router并使用基本服务器即 python -m SimpleHTTPServer 3000这适用于没有路由器代码的 React 应用程序。

控制台中的错误是 Uncaught Error: Parse Error: Line 18: Unexpected token .
<this.props.activeRouteHandler/>

我认为是我的 app.js 找不到 react-router 模块,但可能是 RequireJS 问题(我将它从 CDN 包含在我的索引中)???

Directories
/index.html
/scripts/app.js
/node_modules/react-router

index.html

<!DOCTYPE html>
<html>
<head>
<title>Hello React</title>
<script src="http://fb.me/react-0.10.0.js"></script>
<script src="http://fb.me/JSXTransformer-0.10.0.js"></script>
<script src="http://cdnjs.cloudflare.com/ajax/libs/require.js/2.1.14/require.js"></script>

</head>
<body>
<div id="content"></div>
<script type="text/jsx" src="scripts/app.js"></script>

</body>
</html>

应用程序.js

/** @jsx React.DOM */

var Routes = require('../node_modules/react-router/modules/main').Routes;
var Route = require('../node_modules/react-router/modules/main').Route;
var Link = require('../node_modules/react-router/modules/main').Link;

var About = React.createClass({
render: function() {
return <h2>About</h2>;
}
});

var Users = React.createClass({
render: function() {
return (
<div>
<h2>Users</h2>
<this.props.activeRouteHandler/>
</div>
);
}
});

var User = React.createClass({
render: function() {
return <div>{this.props.params.userId}</div>
}
});

var App = React.createClass({
render: function() {
return (
<div>
<ul>
<li><Link to="about">About</Link></li>
<li><Link to="users">Users</Link></li>
<li><Link to="user" userId="123">User 123</Link></li>
</ul>
<this.props.activeRouteHandler/>
</div>
);
}
});

React.renderComponent((
<Routes>
<Route handler={App}>
<Route name="about" handler={About}/>
<Route name="users" handler={Users}>
<Route name="user" path="/user/:userId" handler={User}/>
</Route>
</Route>
</Routes>
), document.body);

最佳答案

当我升级到 react-router 0.5 时遇到了同样的问题,我什至在使用 react 0.11。我更改为 {this.props.activeRouteHandler()} 并开始工作。不过,我将其标记为要调查的“待办事项”。

无论做什么,都不要放弃。效果很好!我们之前使用的是主干路由器,与我们的旧设置相比,这个 React 路由器真是太好了!

此外,通过您的目录设置,您可以将您的需求更改为“require('react')”,并使用 browserify 将您的应用程序和所需的依赖项构建到单个 js Assets 中。其他一切看起来都不错。

关于javascript - 获取解析错误 <this.props.activeRouteHandler/>,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/25028188/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com