无法读取未定义(反应)的属性“”?

时间:2020-10-16 09:43:25

标签: reactjs ajax

我尝试了绑定,但是它并没有改变任何东西,现在我没有主意了。最小的提示将是巨大的帮助。谢谢!

tryCatch(eval(testdf[nrow(testdf)+1,]<-c(sample(row.names(mtcars),1),sample(1:1000,1),sample(1:10,1),sample(1:10,1),sample(1:10,1))))

和错误位置(成功函数中的setstate):无法读取未定义的属性“ persons”

export default class Login extends React.Component {
 
  constructor(props) {
    super(props);
    this.state = {
    persons: [],
    name: '',
    password: '',
  }
  this.handleSubmit3 = this.handleSubmit3.bind(this);
}

2 个答案:

答案 0 :(得分:1)

同样,您需要绑定方法:

this.handleSubmit3 = handleSubmit3.bind(this);

也将定义更改为功能而不是箭头功能。

function handleSubmit3(e) {
    ...
}

您可以阅读有关箭头功能here

的局限性和用例的更多信息。

答案 1 :(得分:1)

如果您使用的是bind,则不需要arrow functions。您可以在Can you bind 'this' in an arrow function?问题中了解更多有关此内容的信息。

问题在于success: function (data)没有绑定,也没有箭头功能。这意味着this引用成功函数-而不是类。使用箭头功能success: (data) => {}应该可以解决您的问题。

类似这样的东西:

handleSubmit3 = event => {
    event.preventDefault();
    var user = this.state.name + '$' + this.state.password;

    $.ajax({
        url: 'https://localhost:44348/api/user/LoginUserCheckPassword',
        type: 'POST',
        data: JSON.stringify(user),
        contentType: 'application/json',
        dataType: 'json',
        async: false,
        success: (data) => {
            this.setState({persons: this.state.persons, name: this.state.name, password: data});  //error here
        },
        error: (jQXHR, textStatus, errorThrown) => {
            console.log("An error occurred whilst trying to contact the server: " + jQXHR.status + " " + textStatus + " " + errorThrown);
        }

    });
}