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

在react.js中加载DOM时的回调

幸乐湛
2023-03-14
问题内容

当它的DOM元素(包括所有子节点)实际加载到页面上并准备就绪时,我想在我的react.js组件上调用一个回调。具体来说,我有两个要渲染相同大小的组件,选择具有自然尺寸的任何一个组件的最大值。

看起来componentDidMount并不是我真正想要的,因为每个组件仅被调用一次,但是我希望在组件完成渲染后再次调用我的回调。我以为可以将onLoad事件添加到顶级DOM元素中,但是我想这仅适用于某些元素,例如<body><img>


问题答案:

看起来像的组合componentDidMount,并componentDidUpdate会完成这项工作。当DOM可用时,第一个调用在初始渲染之后调用,一旦更新的DOM可用,则在任何后续渲染之后调用第二个调用。就我而言,我都让他们委托一个共同的职能来做同样的事情。



 类似资料:
  • 问题内容: 我已经使用安装了React 。它安装得很好,但是我试图将图像加载到我的一个组件(,文件路径:)中,但是没有加载。这是我的代码: 如果我在变量中写入图像路径,则会出现错误: 编译失败。 ./src/Components/common/Header.js中的错误 找不到模块:/ var / www / html / wistful / src / Components / common中的

  • 主要内容:1. 解析器,2. 加载和解析XML在本章中,我们将学习XML加载和解析。 为了描述API提供的接口,W3C使用称为接口定义语言()的抽象语言。 使用的优势在于开发人员可以学习如何将DOM与他/她喜欢的语言一起使用,并可以轻松切换到其他语言。 缺点是,由于它是抽象的,因此Web开发人员不能直接使用IDL。 由于编程语言之间的差异,它们需要在抽象接口和它们的具体语言之间进行映射或绑定。 DOM已经映射到编程语言,如:Javascrip

  • 这是来自Google Adsense应用程序页面的示例。显示在主页之前的加载屏幕显示在之后。 我不知道如何使用React做同样的事情,因为如果我让React组件渲染加载屏幕,它不会在页面加载时显示,因为它必须等待之前渲染的DOM。 更新: 我以我的方法为例,将屏幕加载程序放入中,并在Reactlifecycle方法中删除它。 示例和反应加载屏幕。

  • 我想做一个reactjs页面懒惰加载图像。因此,我调用lazyLoadImages()内部的组件didMount()。我发现位于浏览器选项卡的浏览器加载指示器仍然一路旋转,直到加载所有图像。这让我认为我所做的并没有提供真正的懒惰加载图像体验。 有趣的是,如果我在setTimeout中用一个不太短的timeout参数包装lazyLoadImages(),例如100ms(不是0或甚至50ms),那么页

  • 问题内容: 我有一个page1.html,其中有这样的链接: 一部分是这样的: 还有这个: 这两个文件在上实现了某些功能,但是当通过 这两个文件导航到该文件时,将无法正常工作,但在完成此操作后,该文件将起作用。怎么了。应该放在哪里?我需要默认设置,以使过渡更加平滑。 问题答案: 根据您更新的问题,您 不能 将 单页模型 与 多页模型 混合使用。当您首先加载 page2.html时,仅第一个加载。其

  • 问题内容: 我有一个角度应用程序,它有两个视图: 1)清单检视 2)详细视图 当您从列表视图中单击缩略图时,将转到详细信息视图,这是以下路线: 现在’listCtrl’控制器中有一个loadmore函数,用于加载 问题 :现在的问题是,如果单击loadmore后进入详细视图,然后又回到列表视图,则新加载的div消失了,如何保存它们? 问题答案: 更改路径时,负责该路径的控制器在加载路径时初始化,而