类型错误：无法读取未定义的 reactjs 的属性'bind'

Question

我从我的pushtofirebase函数中得到了一个TypeError: Cannot read property 'bind' of undefined，即使一切对我来说看起来都很好。将不胜感激任何帮助。

这是代码：

export default class RegisterView extends React.Component {
constructor(props) {
super(props);
this.pushToFirebase = this.pushToFirebase.bind(this);
}
onSubmit = values => {
var user = {
firstName: values.fname,
lastName: values.lname,
email: values.email,
password: values.password
}
firebase.auth().createUserWithEmailAndPassword(values.email, values.password)
.then(function () {
this.pushToFirebase(true);
})
.catch(function (error) {
// Handle Errors here.
var errorCode = error.code;
var errorMessage = error.message;
if (errorCode === 'auth/email-already-in-use') {
console.log(errorMessage);
}
this.pushToFirebase(false);
});
this.pushToFirebase = status => {
if (status) {
const ref = firebase.database().ref('users/').push(user);
console.log('im inside pushToFirebase');
console.log(ref.key);
this.props.setuserkey;
}
}
}
}

我还应该提到，我是 React 的新手，经历了 3 周的可靠 react 开发，并且仍然很新。

再次感谢大家抽出宝贵时间。

Answer 1

您在onSubmit内部声明pushToFirebase。应该是

export default class RegisterView extends React.Component {
// make it class property
pushToFirebase = status => {
if (status) {
const ref = firebase.database().ref('users/').push(user);
console.log('im inside pushToFirebase');
console.log(ref.key);
this.props.setuserkey;
}
}
onSubmit = values => {
var user = {
firstName: values.fname,
lastName: values.lname,
email: values.email,
password: values.password
}
firebase.auth().createUserWithEmailAndPassword(values.email, values.password)
.then( () => { // Use arrow function
this.pushToFirebase(true);
})
.catch( (error) => {  // Use arrow function
// Handle Errors here.
var errorCode = error.code;
var errorMessage = error.message;
if (errorCode === 'auth/email-already-in-use') {
console.log(errorMessage);
}
this.pushToFirebase(false);
});
}
}

此外，您不需要在构造函数中绑定箭头函数属性。

UPD还需要将function()处理程序替换为箭头函数以捕获this.

Answer 2

从函数定义中省略this。而不是：

this.pushToFirebase = status => {

用：

pushToFirebase = status => {

并将其移动到您的类中，而不是 onSubmit 函数。

此外，您不必在构造函数中绑定函数，因为您在此处使用箭头函数。

Answer 3

TypeError： 无法读取未定义的 pushtofirebase 的属性"绑定">

缺少pushtofirebase的函数定义。

因此，没有与此名称的属性this对象相关联。它导致此异常。

Answer 4

将this.pushToFirebase = status => {更改为仅pushToFirebase = status =>并将函数移动到onSubmit函数的外部。

由于它是一个箭头功能，因此您不必this.pushToFirebase = this.pushToFirebase.bind(this); 此行执行，因此可以将其删除

所以它应该看起来像

export default class RegisterView extends React.Component {
constructor(props) {
super(props);
}
pushToFirebase = status => {
if (status) {
const ref = firebase.database().ref('users/').push(user);
console.log('im inside pushToFirebase');
console.log(ref.key);
this.props.setuserkey;
}
}

Answer 5

试试这个

this.pushToFirebase (status) {

希望这对您有所帮助