当前位置: 首页 > 面试题库 >

究竟何时触发componentDidMount?

段曦
2023-03-14
问题内容

这是我在React中经常遇到的问题。componentDidMount保证在首次渲染组件时会触发该方法,因此似乎很自然地进行高度和偏移之类的DOM测量。但是,在组件生命周期的这一点上,很多时候我收到错误的样式读数。该组件

在DOM,当我与调试器打破,但它尚未在屏幕上绘制。我将宽度/高度大部分设置为100%的元素遇到了这个问题。当我进行测量时componentDidUpdate-一切正常,但是此方法在组件的初始渲染时不会触发。

所以我的问题是-何时确切componentDidMount触发,因为在完成所有浏览器绘制后显然不会触发。

编辑:处理相同的主题:

它还引用了这个github对话,解释了会发生什么


问题答案:

componentDidMount()所有子组件都已安装之后,将在反应组件树内部触发。这意味着, 在挂载其父 组件
之前
componentDidMount()会触发任何组件。 __

因此,如果您想测量DOM的位置和大小等,使用componentDidMount()子组件是不安全的时间/地点。

你的情况:由100%的宽度/高度的组件得到准确的读数,安全服用这种测量的地方是里面componentDidMount()的的 顶部
反应成分。
100%是相对于父级/容器的宽度/高度。因此,也只能在安装了父级后才能进行测量。



 类似资料:
  • 我正在使用git跟踪对LaTeX文档的更改。我倾向于将合著者的反馈保存在一个单独的分支中,并在以后将其合并。到目前为止,事情似乎神奇地正确地合并了,但我想知道合并冲突何时发生,这样我就可以在合并过程中获得一些真正的信任(当然我不希望文本出现问题)。 关于StackOverflow,有许多问题似乎问了同样的问题,但没有一个答案是非常具体的。例如,这个答案指定如果对同一个区域进行更改,就会发生冲突,但

  • 问题内容: HashMap中的Hash Collision或Hashing Collision并不是一个新话题,我遇到了多个博客和讨论区,解释了如何产生Hash Collision或如何以模棱两可和详细的方式避免它。我最近在一次采访中遇到了这个问题。我有很多事情要解释,但我认为准确地给出正确的解释真的很困难。抱歉,如果我在这里重复我的问题,请给我准确的答案: 哈希冲突到底是什么?它是一项功能或常见

  • 问题内容: 假设我有一个域,它指向某个IP地址,另一个域,它指向另一个IP地址。从Ajax请求下载的文件可以发送到吗? 现代浏览器如何严格执行同域策略? 问题答案: 对您的问题的简短回答是:否:对于AJAX调用,您只能访问与加载页面时相同的主机名(和端口/方案)。 有两种解决方法:一种是在其中创建一个URL 作为URL 的反向代理。只要主机名匹配,浏览器就不在乎请求的实际位置。如果您已经有一个前端

  • 实际上,恰恰是专有软件的理念--不允许共享或改动软件--是反社会的,也是不道德的,而且也是完全错误的。但是长期以来,软件出版商使人们相信:软件天生就该如此。这种片面的认识禁锢了人们的思维。当他们在谈论如何加强版权或打击盗版时,他们也认定这是天经地义,人们也会毫无异议地接受。 他们的第一个假设就是:软件公司对自己的软件拥有毫无疑问的天然权力,因而可以将权利施加到所有用户身上。(因为如果是天然权力,那

  • 同样一个1000w的表,都有业务字段所索引 为什么oracle查起来很轻松,mysql就建议分库分表了。 是索引实现的区别导致的吗?还有底层IO读取的优化上的区别?还有哪些区别? 网上查的资料,讲的都太虚了,没讲到本质上

  • 我知道React的虚拟DOM更快有两个理由- > 它只更新那些实际需要更新的元素(使用diff)。 它批量更新,因此我们只更新一次真正的DOM。因此,重新喷漆也只能进行一次,否则会进行多次。 我对这两点都有疑问- > 据我所知,所有现代浏览器的效率都足以只更新DOM中所需的元素。例如,如果我有两个“p”标记,并且我使用按钮单击更改其中一个p标记中的文本,那么safari将只更新该p标记(我已使用油