警告为Warning: React.createElement: type should not be null, undefined, boolean, or number. It should be a string (for DOM elements) or a ReactClass (for composite components).
然后在Error: Invariant Violation: Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: undefined.
renderToString
整个代码是:
import { renderToString } from 'react-dom/server';
import * as React from "react";
import * as ReactDOM from "react-dom";
let History = require("history");
let ReactRouter = require("react-router");
let match = ReactRouter.match;
let RouterContext = ReactRouter.RouterContext;
let Route = ReactRouter.Route;
let Router = ReactRouter.Router;
let Link = ReactRouter.Link;
let TestComponent = React.createClass({
render: function() {
return (
<button>test</button>
);
}
});
console.log(renderToString(<TestComponent/>));// a
let routes = [
<Route path="/" component={TestComponent}/>
];
match({ routes, location: "/" }, (error, redirectLocation, renderProps) => {
if (error) {
console.log(error);
return;
}
if (redirectLocation) {
console.log(redirectLocation);
return;
}
if (renderProps) {
let component = <RouterContext {...renderProps} />;// b
console.log(renderToString(component));// c
}
});
a
的输出是正确的。
警告位于b
。
错误发生在c
。
环境:
代码基于https://github.com/rackt/react-router/blob/master/docs%2Fguides%2Fadvanced%2FServerRendering.md
处的文档答案 0 :(得分:3)
我在RouterContext
的源代码中找不到react-router
。
但是有RoutingContext
,所以我使用它,现在就可以了。
感谢@limelights
这似乎是react-router
https://github.com/rackt/react-router/issues/2713