无法读取undefined的属性“setState”

我得到以下错误

即使在构造函数中绑定了delta。

class Counter extends React.Component {
    constructor(props) {
        super(props);

        this.state = {
            count : 1
        };

        this.delta.bind(this);
    }

    delta() {
        this.setState({
            count : this.state.count++
        });
    }

    render() {
        return (
            <div>
                <h1>{this.state.count}</h1>
                <button onClick={this.delta}>+</button>
            </div>
        );
    }
}

当前回答

箭头函数可以使您更容易避免绑定此关键字。像这样:

 delta = () => {
       this.setState({
           count : this.state.count++
      });
   }

2019-08-05 01:04:53

其他回答

箭头函数可以使您更容易避免绑定此关键字。像这样:

 delta = () => {
       this.setState({
           count : this.state.count++
      });
   }

2019-08-05 01:04:53

您需要将其绑定到构造函数，并记住对构造函数的更改需要重新启动服务器。否则，您将以相同的错误结束。

2015-11-16 16:34:00

如果你使用的是ES5语法，那么你需要正确绑定它

this.delta = this.delta.bind(this)

如果你正在使用ES6及以上版本，你可以使用箭头函数，那么你不需要使用bind()它

delta = () => {
    // do something
  }

2020-02-05 16:02:45

你必须用'this'(默认对象)绑定你的方法。不管你的函数是什么只要把它绑定到构造函数中。

constructor(props) {
    super(props);
    this.state = { checked:false };

    this.handleChecked = this.handleChecked.bind(this);
}

handleChecked(){
    this.setState({
        checked: !(this.state.checked)
    })
}

render(){
    var msg;

    if(this.state.checked){
        msg = 'checked'
    }
    else{
        msg = 'not checked'
    }

    return (
        <div>               
            <input type='checkbox' defaultChecked = {this.state.checked} onChange = {this.handleChecked} />
            <h3>This is {msg}</h3>
        </div>
    );

2018-01-21 17:33:47

当在React中使用ES6代码时，总是使用箭头函数，因为这个上下文会自动与它绑定

用这个:

(videos) => {
    this.setState({ videos: videos });
    console.log(this.state.videos);
};

而不是:

function(videos) {
    this.setState({ videos: videos });
    console.log(this.state.videos);
};

2016-03-15 16:14:44

无法读取undefined的属性“setState”

推荐文章

最新文章

标签