Javascript TypeError:无法读取子组件到父组件中未定义的属性“setState”

我得到以下错误

TypeError: Cannot read property 'setState' of undefined
closeAlert

这似乎是绑定还是道具的问题

那我该怎么办

主要组成部分：

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

    this.state = {
        alertOpen : false
    };

    this.closeAlert.bind(this);
}

closeAlert(event) {
    this.setState({
        closeAlert : true
    });
}

render() {
    return (
        <div>
            <AlertWindow
closeAlert={this.closeAlert}
             />
        </div>
    );
}
}

    const AlertWindow = ({ closeAlert }) => {
    return (
    <Alert type="primary">

    <Button
      color="secondary"
      RootComponent="button"
      onClick={(event) => {
        closeAlert(event)
      }}
    >
      No, thanks
    </Button>
  </Button.List>
   </Alert>
  );
  };

子组件：

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

    this.state = {
        alertOpen : false
    };

    this.closeAlert.bind(this);
}

closeAlert(event) {
    this.setState({
        closeAlert : true
    });
}

render() {
    return (
        <div>
            <AlertWindow
closeAlert={this.closeAlert}
             />
        </div>
    );
}
}

    const AlertWindow = ({ closeAlert }) => {
    return (
    <Alert type="primary">

    <Button
      color="secondary"
      RootComponent="button"
      onClick={(event) => {
        closeAlert(event)
      }}
    >
      No, thanks
    </Button>
  </Button.List>
   </Alert>
  );
  };

---

bind语句不正确，请将其更改为以下内容：

this.closeAlert = this.closeAlert.bind(this);

您需要将绑定函数分配给类方法。没有赋值就绑定是不够的

---

希望这有帮助

您的bind语句不正确，请将其更改为以下内容：

this.closeAlert = this.closeAlert.bind(this);

您需要将绑定函数分配给类方法。没有赋值就绑定是不够的

---

希望这有帮助

我想你对这个名字有点困惑。您正在设置alertOpen状态。 不太清楚AlertWindow的作用，但您需要一个调用closeAction的操作，如onClick={this.closeAlert}

正如@Alexander提到的，你的绑定不正确

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

        this.state = {
            alertOpen : true
        };

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

    closeAlert(event) {
        this.setState({
            alertOpen : false
        });
    }

    render() {
        return (
            <AlertWindow
closeAlert={this.state.closeAlert}
             />
        );
    }
}

---

您的“打开”和“关闭”混淆了，所以我不知道初始状态应该是什么。

我想您对命名有点困惑。您正在设置alertOpen状态。 不太清楚AlertWindow的作用，但您需要一个调用closeAction的操作，如onClick={this.closeAlert}

正如@Alexander提到的，你的绑定不正确

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

        this.state = {
            alertOpen : true
        };

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

    closeAlert(event) {
        this.setState({
            alertOpen : false
        });
    }

    render() {
        return (
            <AlertWindow
closeAlert={this.state.closeAlert}
             />
        );
    }
}

您的“打开”和“关闭”混淆了，因此我不知道初始状态应该是什么。

另一个简单的解决方法： 将cloaseAlert方法转换为：

closeAlert=(event)=> {
  this.setState({
    closeAlert : true
  });
}

现在，构造函数中的方法不需要binding语句，这是另一个简单的解决方法： 将cloaseAlert方法转换为：

closeAlert=(event)=> {
  this.setState({
    closeAlert : true
  });
}

现在您不需要构造函数中方法的binding语句