react ajax 加载阻塞

最新推荐文章于 2024-08-05 11:37:51 发布

Baymax627

最新推荐文章于 2024-08-05 11:37:51 发布

阅读量3.5k

点赞数

分类专栏：前端 react 文章标签： react

本文链接：https://blog.csdn.net/jl381169437/article/details/52454039

版权

在React应用中，当数据依赖于后台AJAX请求时，若请求失败或网络不佳，会导致页面加载被阻塞。为解决此问题，可以采取两种策略：1) 将AJAX请求放在父组件中，通过props传递数据，避免阻塞；2) 在组件内部，如果必须执行AJAX请求，可以在请求期间先渲染其他内容。

摘要由CSDN通过智能技术生成

在动态 render 的时候，数据从后台获取，如果连不上网会阻塞页面加载，在写组件时碰到这个问题。查看 stackoverflow 提供两个方法：
一、将 ajax 请求放到父节点，通过 props 传值，不会造成阻塞

代码来自 stackoverflow： http://stackoverflow.com/questions/27192621/reactjs-async-rendering-of-components
var Parent = React.createClass({
  getInitialState: function() {
   
    return { data: null };
  },

  componentDidMount: function() {
   
    $.get('http://foobar.io/api/v1/listings/categories/').done(