美文网首页
修改state的值,this.setState

修改state的值,this.setState

作者: ticktackkk | 来源:发表于2020-06-09 01:01 被阅读0次

    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));
    

    相关文章

      网友评论

          本文标题:修改state的值,this.setState

          本文链接:https://www.haomeiwen.com/subject/vfyrtktx.html