在构造方法中对this.state.age进行初始化为0，然后通过按钮的单击事件对该属性进行变更alert变更后的值。

发现第一次点击按钮弹出来的是0，第二次才是变更后的值

constructor(){

super();

this.state = {userName : 'sugs' , age : 0};

};

buttonClick(ageCode){

this.setState({

age : ageCode

});

alert(this.state.age);

}

完整代码如下

import React from 'react';

import ReactDom from 'react-dom';

import propTypes from 'prop-types';

import BodyChildren from './bodyChildren';

class BodyIndex extends React.Component {

componentWillMount(){

console.log("BodyIndex - componentWillMount");

};

componentDidMount(){

console.log("BodyIndex - componentDidMount");

};

constructor(){

super();

this.state = {userName : 'sugs' , age : 0};

let t = setTimeout(() => {

this.setState({userName : 'suguisong'})

}, 3000);

};

childValueChg(event){

this.setState({

text : event.target.value

});

};

buttonClick(ageCode){

this.setState({

age : ageCode

});

alert(this.state.age);

}

render() {

console.log("BodyIndex - render");

let userName = this.state.userName;

let boolean = false;

let html = 'react studio ';

return (

<div>

<b>body部分 …… ……</b><br/>      

<input type="button" value={'我是input类型的按钮'} onClick={this.buttonClick.bind(this, 68)}/>

<br/><br/><br/>

<BodyChildren childValueChg={this.childValueChg.bind(this)}/>

<p>子页面返回：{this.state.text}</p>

<b>{userName == '' ? '用户未登录' : '用户名：' + userName}</b><br/><br/>

<b>{html}</b><br/>

{ /** 两种方法：1、使用uncode转码&nbsp;等字符    2、使用dangerouslySetInnerHTML方法，但是小心恶意攻击 */ }

<b dangerouslySetInnerHTML={{__html : html}}></b><br/><br/>

<b>接收父页面的年龄：{this.props.age}</b><br/>

</div>

)

};

}

BodyIndex.propTypes = {

age : propTypes.number.isRequired

}

BodyIndex.defaultProps = {

age : 86

}

export { BodyIndex as default };