reactjs渲染方法完成后执行javascript

Posted

技术标签:

【中文标题】reactjs渲染方法完成后执行javascript【英文标题】:Execute javascript after reactjs render method has completed 【发布时间】:2015-05-23 21:07:06 【问题描述】:

我有一个 reactjs 组件:

var com1 = React.createClass(
    render: function() 
        return (  
    <a href='#'>This is a text</a>
    );
  
);

一旦这个组件的渲染完成,我想执行 javascript/Jquery。简单地将 Javascript 添加到渲染方法似乎不起作用。

我将如何实现这一目标?

【问题讨论】:

我猜你可以使用com1.promise().done(fn) 对不起,请您详细说明一下,我是 reactjs 新手,现在可以确定您的意思。例如,我将把这段代码放在哪里,我假设“fn”可以使用任何 javascript(例如 alert("test"))? 【参考方案1】:

使用componentDidMount 方法在初始渲染后运行代码,使用componentDidUpdate 在每次更新组件状态后运行代码。

【讨论】:

【参考方案2】:

在此处查看文档:https://facebook.github.io/react/docs/component-specs.html#mounting-componentdidmount

在组件生命周期中,您可以为 componentDidMount 定义一个回调——即,渲染函数已经完成并且生成的元素已经插入到 DOM 中。

【讨论】:

以上是关于reactjs渲染方法完成后执行javascript的主要内容,如果未能解决你的问题,请参考以下文章

Reactjs 异步渲染组件

ReactJs:如何在渲染之前等待 componentDidMount() 完成?

reactJS 和动态渲染和变量填充

AJAX 调用 ReactJS 后渲染组件

reactjs:动作后redux不会重新渲染

发布后 ReactJs.net 服务器端渲染失败