反应componentDidMount没有开火 [英] react componentDidMount not firing

问题描述

我设置了一个新的反应项目，由于某种原因，没有调用 componentDidMount 方法。

I set up a new react project and for some reason, the componentDidMount method is not being called.

我通过在 componentDidMount <中调用 console.log 来验证此行为/ code>但我无法在控制台中看到它的输出。

I have verified this behavior by placing a call to console.log in componentDidMount but I cannot see its output in the console.

此外， this.setState（）不工作。

我很难理解为什么没有调用 componentDidMount 。我尝试使用Reactv0.14.0和v0.14.3。

I'm pretty stumped as to why the componentDidMount is not being called. I tried using both React "v0.14.0" and "v0.14.3".

为什么没有调用'componentDidMount'？

Why is 'componentDidMount' not being called?

代码：

var React = require('react');

var RecipePage = React.createClass({
  componentDidMount: function() {
    console.log('mounted!');
  },
  render: function() {
    return (
      <div>Random Page</div>
    );
  }
});

module.exports = RecipePage;

推荐答案

所以......瞧瞧....我终于让它工作了（在后端专家的帮助下）。 componentDidMount方法未被触发的原因是因为我的服务器正在捆绑并提供服务器端的所有react + html内容。 （只有render和getInitialState方法被调用才能创建通过客户端浏览器传递的html模板......但它停在那里因为它认为它已经完成了）

So... lo and behold.... I finally got it working(with the help of a back-end expert). The reason why the "componentDidMount" methods weren't firing was because my server was bundling and serving all the react + html stuff on server side. (Only "render" and "getInitialState" methods get called to create the "html" template that gets delivered through the client's browser...but it stops there because it thinks it's finished)

修复：找到一种通过服务器提供生成的已编译html的方法此外，允许反应自己的事件可以访问并在客户端再次触发侧即可。在编译我的视图文件（index.js或index.html）时，我包含了一个Application.start（）脚本，它再次将我的bundle.js代码注入到模板中。然后在我的gulpfile中，导出Application变量，以便view文件可以访问它。

The fix: Find a way to deliver the resulting "compiled" html through the server AND in addition, allow react's own events to be accessible and "fireable" again on the client side. When compiling my "view" file( index.js or index.html ), I included an "Application.start()" script that injects my bundle.js code into the template again. Then in my gulpfile, exported the "Application" variable so the "view" file can access it.

Gahh ......为此拉了我的头发。是时候阅读服务器端与客户端渲染

Gahh...pulled my hair out for this. Time to read up on server side vs. client side rendering

这篇关于反应componentDidMount没有开火的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！