组件内部未定义函数

时间:2018-12-18 19:46:36

标签: reactjs

我尝试reactjs,我得到一个未定义,我不知道为什么。 代码真的很简单,但是也许我没有得到一些东西?!

  isMailValid(mail) {
    const valid_mail = RegExp("[a-z0-9!#$%&'*+/=?^_`{|}~-]+(?:\.[a-z0-9!#$%&'*+/=?^_`{|}~-]+)*@(?:[a-z0-9](?:[a-z0-9-]*[a-z0-9])?\.)+[a-z0-9](?:[a-z0-9-]*[a-z0-9])?");
    console.log("res => " + valid_mail.test(mail));
    return valid_mail.test(mail);
  }

  isMailOk() {
    var res = this.isMailValid(this.state.mail)
    if (res === true)
      return (<p class="false">invalid mail</p>);
    return (<p class="good">Mail Ok</p>); 
  }

我没有定义'isMailValid'no-undef。 寻求帮助

1 个答案:

答案 0 :(得分:1)

该函数未定义,因为它与调用它的函数不在同一范围内。要访问它,您必须在调用之前加上this.来告诉React在哪里可以找到该函数。

isMailOk() {
    if (this.isMailValid(this.state.mail) === true)
      return (<p class="false">Mail invalid</p>);
    return (<p class="good">Mail Ok</p>); 
  }

您还必须将自定义函数绑定到this。您可以通过在构造函数中放置this.isMailOk = this.isMailOk.bind(this);来实现。您必须同时使用两个自定义函数。诸如render之类的函数不需要绑定到此,因为从React.Component扩展类时它们是继承的。您可以阅读有关绑定到this in the docs的更多信息。