渲染某个页面（组件），用到的数据需要通过ajax向后台获取，ajax方法一般写在componentDidMount里面，如果不做任何处理，请求数据之后会有一个rerender的过程，导致数据的展现很生硬。
我想在数据加载完成之后再显示这个页面，加载之前，设置个loading效果，代码如下：
class Profile extends Component {
constructor(props) {
super(props);
this.state = {
loading: true
};
}
componentDidMount() {
// 数据异步请求，请求成功之后setState
this.setState({
loading: false
})
}
render() {
return (
<div>
{
this.state.loading
? <div>加载中。。。</div>
: <div>页面内容</div>
}
</div>
)
}
}
渲染某个页面（组件），用到的数据需要通过ajax向后台获取，ajax方法一般写在componentDidMount...
渲染React组件 通过ReactDOM直接渲染 通过React.Component创建组件再通过ReactDOM...
Vue的异步组件 异步组件实现的本质是 2 次渲染，除了 0 delay 的高级异步组件第一次直接渲染成 load...
组件列表渲染场景 DOM复用 react 的重点在于首次渲染和更新渲染，现在考虑更新渲染如何复用DOM 让渲染更有...
React代码规范 components 展示性组件里面一般存放ui组件，负责组件的外表，也就是组件如何渲染，具有...
immutable如何优化react项目性能 react组件接收新的state和props之后默认会发生渲染，即使...
React组件的渲染流程是什么？ 使用 React.createElement或 JSX编写 React组件，实际...
目录 一.react异步加载组件，分模块加载，提高打开性能 二. 三. 四. 一.react异步加载组件，分模块加...
今天我们来谈谈在react、vue、小程序中是如何更新数据并渲染组件的 React React中，直接赋值不会重新...
初学React发现组件在异步传值时出现子组件在第一次接收不到父组件传递过来的值，这也导致了子组件无法正常的渲染页面...
本文标题：React异步渲染组件，如何设置Loading效果？
本文链接：https://www.haomeiwen.com/subject/mzdvgqtx.html
网友评论