我正在将Numbers组件中的数字值发送到Main组件.一切正常,直到我将主组件中的值设置为该组件的状态.
var Numbers = React.createClass({
handleClick: function(number){
this.props.num(number)
},
render: function(){
return (
<div>
<button onClick={this.handleClick.bind(null, 1)}>1</button>
<button onClick={this.handleClick.bind(null, 2)}>2</button>
<button onClick={this.handleClick.bind(null, 3)}>3</button>
</div>
)
}
})
var Main = React.createClass({
getInitialState: function(){
return {
number: 0
}
},
handleCallback: function(num){
console.log("number is right here: " + num);
this.setState({
number: num
})
console.log("but wrong here (previous number): " + this.state.number)
},
render: function() {
return (
<Numbers num={this.handleCallback} />
//<SomeComponent number={this.state.number} />
)
}
});
React.render(<Main />, document.getElementById('container'));
Run Code Online (Sandbox Code Playgroud)
它为什么会这样?其次console.log …