当前位置: 首页 > 知识库问答 >
问题:

在React中为异步请求使用componentWillMount或componentDidMount生命周期函数

郭兴平
2023-03-14

我正在阅读react lifecycle,有点困惑。有些人建议使用componentWillMount进行ajax调用:

https://hashnode.com/post/why-is-it-a-bad-idea-to-call-setstate-immediately-after-componentdidmount-in-react-cim5vz8kn01flek53aqa22mby

在componentDidMount中调用setState将触发另一个render()调用,这可能导致布局抖动。

在其他地方,它说不要把ajax调用放在组件中。

https://medium.com/@baphemot/理解-reactjs-组件-生命周期-823a640b3e8d

...在调用初始渲染之前,这个函数可能会被多次调用,因此可能会引发多种副作用。由于这个事实,不建议使用此功能的任何副作用引起的操作。

哪个是正确的?

共有3个答案

步衡
2023-03-14

组件安装就是这个地方。

但是,如果您有时间尝试查看Redux并在操作中发出请求,那么随着应用程序的增长,它将有助于管理应用程序状态。

;)

荀正谊
2023-03-14

componentDidMount是推荐的生命周期方法,用于进行文档中描述的Ajax调用

邬楚青
2023-03-14

React文档建议使用组件didMount进行网络请求

componentDidMount()在安装组件后立即调用。需要DOM节点的初始化应该在这里进行。如果需要从远程endpoint加载数据,这是实例化网络请求的好地方。

在此方法中调用setState()将触发额外的呈现,但保证在同一滴答期间刷新。这保证了即使在这种情况下将调用渲染()两次,用户也不会看到中间状态。

根据组件将安装的情况

编辑:

此生命周期已弃用,因为v16。react的3.0,不再鼓励使用。但是,其重命名为UNSAFE_组件将更新,预计至少在react的v17之前工作

在v16之前。3

在呈现发生之前,获取数据的异步调用不会返回。这意味着组件将至少呈现一次空数据。

无法“暂停”渲染以等待数据到达。您不能从组件willmount返回promise,也不能以某种方式在设置超时中争吵。正确的处理方法是设置组件的初始状态,使其对渲染有效。

总结一下

实际上,componentDidMount是放置调用以获取数据的最佳位置,原因有二:

  • 使用DidMount可以清楚地表明,只有在初始渲染之后才会加载数据。这提醒您正确设置初始状态,这样您就不会出现导致错误的undefined状态

 类似资料:
  • 问题内容: 我正在阅读反应生命周期,并感到有些困惑。一些建议使用componentWillMount进行ajax调用: https://hashnode.com/post/why-is-it-a-bad-idea-to-call-setstate-immediately- after-componentdidmount-in-react- cim5vz8kn01flek53aqa22mby 在co

  • vue中,假如子组件在created发送了一个异步请求,父组件在mouted内发送一个异步请求,如何保证父组件在异步请求后能够拿到子组件异步数据。也就是说我希望在子组件和父组件异步都结束后拿到两者的值做一些操作,请问这个有什么比较好的办法嘛。

  • 本文向大家介绍react生命周期函数相关面试题,主要包含被问及react生命周期函数时的应答技巧和注意事项,需要的朋友参考一下 这个问题要考察的是组件的生命周期 一、 初始化阶段: Constructor初始化状态 componentWillMount:组件即将被装载、渲染到页面上 render:组件在这里生成虚拟的DOM节点 componentDidMount:组件真正在被装载之后 二、 运行中

  • 每个请求对象只在一个 servlet 的 service 方法的作用域内,或过滤器的 doFilter 方法的作用域内有效,除非该组件启用了异步处理并且调用了请求对象的 startAsync 方法。在发生异步处理的情况下,请求对象一直有效,直到调用 AsyncContext 的 complete 方法。容器通常会重复利用请求对象,以避免创建请求对象而产生的性能开销。开发人员必须注意的是,不建议在上

  • 忽视省略(elision)情况,带上生命周期的函数签名(function signature)有一些限制: 任何引用都必须拥有标注好的生命周期。 任何被返回的引用都必须有一个和输入量相同的生命周期或是静态类型(static)。 另外要注意,若会导致返回的引用指向无效数据,则返回不带输入量的引用是被禁止的。下面例子展示了一些带有生命周期的函数的有效形式: // 一个拥有生命周期 `'a` 的输入引用

  • 问题内容: 在react docs中,建议使用以下方法发出初始网络请求: 挂载组件后立即调用。需要DOM节点的初始化应该在这里进行。如果需要从远程端点加载数据, 这是实例化网络请求的好地方。 在此方法中设置状态将触发重新渲染。 如果在呈现组件之前调用,那么在这里发出请求并设置状态不是更好吗?如果在这样做,则呈现组件,发出请求,更改状态,然后重新呈现组件。为什么在呈现任何内容之前发出请求更好呢? 问