Я разрабатываю изоморфное приложение, используя react и express.js. Я использую React Router для маршрутизации на стороне клиента. При запуске приложения я получаю следующие ошибки и предупреждения в консоли
Предупреждение: ошибка propType: недопустимый реквизит handler типа object указан для Route, ожидаемый function.
Предупреждение. Недопустимый неопределенный handler типа object указан для UnknownComponent, ожидается function.
TypeError: type.toUpperCase не является функцией
Вот код для components/main.jsx
var React = require('react');
var Counter = require('./flashCard.js');
var RouterModule = require('react-router');
var RouteHandler = require('react-router').RouteHandler
var routes = require('./routes.js')
var APP = React.createClass({
render: function() {
return (
<html>
<head>
<title>8 facts</title>
<link rel="stylesheet" type="text/css" href="/stylesheets/style.css"/>
<script src="/javascripts/bundle.js"></script>
</head>
<body>
<RouteHandler/>
</body>
</html>
);
}
});
module.exports = APP;
if(typeof window !== 'undefined') {
window.onload = function() {
RouterModule.run(routes,RouterModule.HistoryLocation, function (Handler) {
React.render(<Handler/>, document);
});
}
}
Вот код для components/routes.jsx
var React = require('react');
var Route = require('react-router').Route
var Counter = require('./flashCard.js');
var App = require('./main.js')
var Demo = require('./demo.js')
var routes = (
<Route name="home" handler={App}>
<Route path="/" handler={Counter}/>
<Route path="/demo" name ="demo" handler={Demo}/>
</Route>
);
module.exports = routes;
Вот код рендеринга на стороне сервера. app.js
var express = require('express');
var http = require('http');
var path = require('path');
var favicon = require('static-favicon');
var logger = require('morgan');
var cookieParser = require('cookie-parser');
var bodyParser = require('body-parser');
require('node-jsx').install();
var db = require('./models/schema.js');
var mongoose = require('mongoose');
var app = express();
var React = require('react');
var RouterModule = require('react-router')
var routes = require('./components/routes.js')
var posts = require('./routes/index.js');
//database
db.connectDB().then(function(){
console.log('connected');
}, function(err){
console.log('error');
});
//database
// view engine setup
app.set('views', path.join(__dirname, 'views'));
app.set('view engine', 'jade');
app.use(favicon());
app.use(logger('dev'));
app.use( bodyParser.json() ); // to support JSON-encoded bodies
app.use(bodyParser.urlencoded({ // to support URL-encoded bodies
extended: true
}));
app.use(cookieParser());
app.use(express.static(path.join(__dirname, 'public')));
app.use('/posts', posts);
//server side rendering code
app.use(function(req, res) {
RouterModule.run(routes, req.path, function(Handler) {
var Html = React.createElement(Handler);
res.send(React.renderToString((Html)));
});
});
