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生命周期中.
但这种情况也有效.
在Chrome控制台中,React不会抛出任何错误和警告.那么,我的问题是这样的用法是完全正确的吗?有错误吗?
解决方法
您可以在任何地方进行AJAX调用.在构造函数中进行AJAX调用没有“错误”,但有一个问题.您只想在安装组件之后或即将安装组件之前进行AJAX调用.
因此,在呈现组件之前,建议在componentDidMount()或componentwillMount()中进行AJAX调用.仅仅因为React允许做“事情”并不意味着你应该做到!
总结
以上是DEVMAX为你收集整理的javascript – 我可以将ajax放在React组件构造函数中吗?全部内容。
如果觉得DEVMAX网站内容还不错,欢迎将DEVMAX网站推荐给好友。