作者热门文章
- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
为什么当我执行 this.setState({count:this.state.count*2})
时它有效,但是当我执行时: this.setState({count :this.state.count++})
它不起作用?
为什么,以及如何解决它?
完整代码:
var Hello = React.createClass({
getInitialState:function(){
return {count:parseInt(this.props.count)}
},
a:function(){
this.setState({count:this.state.count++})
console.log(this.state)
},
render: function() {
console.log(this.state)
return <div onClick={this.a}>Click to increment the counter<b> {this.state.count} </b></div>;
}
});
ReactDOM.render(
<Hello count="1" />,
document.getElementById('container')
);
但是这段代码可以工作:
a:function(){
this.setState({count:this.state.count*2})
console.log(this.state)
},
JSFiddle:https://jsfiddle.net/69z2wepo/55100/
最佳答案
setState
是一个异步函数。 React 可能会将一堆 setState
一起批处理。因此 this.state.count
的值就是您发出请求时的值。
调用在执行 setState 时评估的函数的更好解决方案。
this.setState((prevState, props) => ({
counter: prevState.counter + 1
}));
来自 https://facebook.github.io/react/docs/state-and-lifecycle.html
关于reactjs - 如何在 React 中使用增量运算符,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/39316376/
我是一名优秀的程序员,十分优秀!