我正在尝试在服务器端呈现我的网页以获得更好的性能,但我遇到了一个问题,即我的页面组件 componentDidMount()
没有被调用。
例如,这是我的主要模板文件:
import React from 'react';
import Cube from './components/Cube/Cube.jsx';
class Index extends React.Component {
render() {
return (
<html>
<head>
<title>{this.props.title}</title>
</head>
<body>
<Cube />
</body>
</html>
);
}
}
还有我的 Cube.jsx:
import React from 'react';
class Cube extends React.Component {
componentDidMount() {
console.log("Hey!");
}
render() {
return (
<div>
<h1>Hello</h1>
</div>
);
}
}
export default Cube;
我没有看到“嘿!”即使我在页面加载时看到
<h1>Hello</h1>
,我的 pm2 日志和 Chrome 控制台也被注销。这阻止我对我的组件有任何逻辑。我如何解决这个问题并使我的子组件的
componentDidMount()
被调用?注意我使用 express-react-views
进行服务器端渲染。 最佳答案
我认为将被称为服务器端的唯一生命周期钩子(Hook)是 componentWillMount
,如 here 所述
即便如此,您也不会在 Chrome 的控制台上看到输出。您可能只会在 Node 日志中看到它。
如果这能回答您的问题,请告诉我。
关于node.js - 服务器端渲染中的 ComponentDidMount(),我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/46143994/