class AjaxInConstructor extends React.Component{ constructor() { super(); this.state = {name: '',age: ''} this.loadData().then(data => { this.setState(data); }); } loadData() { return new Promise((resolve,reject) => { setTimeout(() => { resolve({ name: '我去去去去nimabi',age: 123 }); },2000); }); } render() { const {name,age} = this.state; return <div> <p>Can I init component state async?</p> <p>name: {name}</p> <p>age: {age}</p> </div> } } ReactDOM.render( <AjaxInConstructor/>,document.body )
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react-dom.min.js"></script>
以上是我的演示代码.我知道人们总是把ajax放在componentDidMount或componentwillMount生命周期中.
但这种情况也有效.
解决方法
您可以在任何地方进行AJAX调用.在构造函数中进行AJAX调用没有“错误”,但有一个问题.您只想在安装组件之后或即将安装组件之前进行AJAX调用.
因此,在呈现组件之前,建议在componentDidMount()或componentwillMount()中进行AJAX调用.仅仅因为React允许做“事情”并不意味着你应该做到!
原文地址:https://www.jb51.cc/ajax/159546.html
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。