javascript - 单击按钮时想要在 saveInfo() 函数内执行 disNone() 函数

Question

我想在单击按钮时在 saveInfo() 内执行 disNone() : 错误:TypeError:无法读取未定义的属性“disNone”

import React, { Component } from 'react';

class Login extends Component {
constructor(props){
    super(props);

    this.state = {
        dispNone:"dispNone",
        message:"dispNone"
    };
    this.disNone = this.disNone.bind(this);
};

 disNone(){
    this.setState({
        dispNone: "dispNone",
        message:"dispBlock"
    });
}


 saveInfo(){
    this.disNone(); 
 }

render() {
    return (
       <div>
         // other code
          <button onClick={this.saveInfo}>Sign up</button>
       </div>
    );
  }
}

export default Login;

Answer 1

在构造函数中，除了this.disNone = this.disNone.bind(this)之外，还需要放入

this.saveInfo = this.saveInfo.bind(this);

该错误是因为 safeInfo 不知道 this 的含义，这会导致错误 disNone 未定义

编辑:我们在构造函数中执行此操作，因为我们只需绑定(bind)该函数一次。或者，您也可以将其写入 render 函数中，但这意味着每次 render 函数执行时，您都会重新绑定(bind)该函数，这是一种浪费。

第三种选择是在渲染函数内使用 () => this.saveInfo() ，这不需要在任何地方进行任何类型的绑定(bind)，但同样，该函数必须是“每次 render 函数运行时创建”。