0

这个问题完全不同，因为我搜索了很多类似但没有找到任何我正在创建一个反应服务器端渲染功能的项目并使用 webpack 编写es6代码和 babel 来编译jsx. 在我的快速路线中，我想将App组件转换为字符串，然后传递给静态 html 部分。当我这样做时它工作正常

  var App = renderToString(<h1> Working Fine now </h1>);

但是现在当我希望 App 组件在这里时它不起作用

var App = renderToString(<App />); // Not working

我正在像这样在快速服务器中导入 App 组件

    import React from "react";
    import ReactDOMServer , {renderToString} from "react-dom/server";
    import  App  from '../common/component/App.js';

我的 App.js

import React from "react"

 export default class App extends React.Component{
  render(){
    return (
      <div>
        <h1>From COmponent</h1>

      </div>
    )
  }
}

错误

不变违规：元素类型无效：预期为字符串（对于内置组件）或类/函数（对于复合组件），但得到：未定义。

我也在 Github 中检查了一些问题，但他们建议迁移到 react-0.14，因为这些问题很旧，但现在我使用的是 react 16

4

1 回答 1

-1

因为您已经在导入 AppLine No 3

import App from '../common/component/App.js';

因此，要解决您的问题，只需替换此行

var App = renderToString(<App />); // Not working

有了这个

let MyApp = renderToString(<App />); // Working

于 2018-05-27T10:59:19.353 回答