[英]React - server side component rendering
我正在尝试在服务器上渲染一个非常简单的React组件:
/** @jsx dom */
var React = require("react");
var Title = React.createClass({
render: function(){
return(<h1>Hello World</h1>)
}
});
module.exports = React.createFactory(Title);
当我调用ReactDOMServer.renderToString(Component)时出现Error: Invariant Violation: renderToString(): You must pass a valid ReactElement.
如果我改为使用React.createElement(Title),我得到
return(dom.h1(null, "Hello World"))
^
ReferenceError: dom is not defined
路线文件:
var express = require('express'),
router = express.Router(),
React = require("react")
ReactDOMServer = require("react-dom/server");
JSX = require('node-jsx').install({
extension: '.jsx'
}),
AssessmentComponent = require("../react/components/title.react.jsx");
我不知道为什么这不起作用!
所以我犯了一些错误。 解决方案如下:
a)在需要组件时使用babel / register意味着可以在没有任何麻烦的情况下即时进行转堆;)
b)dom是通过Babel的@jsx dom语法插入的。 现在不需要使用babel / register了。
c)建议不要使用createFactory导出组件,因为该组件的其他用户可能希望在其上调用createElement。
d)我在路由文件上调用了createFactory,但是它似乎返回了需要调用的函数。 ReactDOMServer.renderToString(Component())
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.