修改state的值,this.setState
2020-06-09 本文已影响0人
ticktackkk
react中想为state修改值,this.state.xxx = xxx是无法修改的
可以通过this.setState来修改
import React, { Component } from "react";
class App extends Component {
constructor(props) {
super(props);
this.state = {
msg: "haha",
name:'hehe',
age:22
};
}
render() {
return (
<div>
<button onClick={() => this.show()}>click me </button>
<h1>{this.state.msg}</h1>
</div>
);
}
show = () => {
console.log(this);
this.setState({
msg: "123",
});
};
}
export default App;
注意点一、
修改state,只会修改自已指定的值并不会全部覆盖其他的state状态的值
注意点二、
this.setState是异步执行的,如果想拿到最新的值可以在this.setState回调中拿到最新的值
this.setState({},callback);
this.setState({
msg: "123",
},function(){
console.log(this.state.msg));