VueJS 和 axios - 如何在發布請求中訪問數據

Question

我有這樣的數據：

  data: () => ({
    input: {
      username: "",
      password: ""
    }
  }),

並發出這樣的帖子請求：

loggin_in() {
  if (this.input.username != "" && this.input.password != "") {
    console.log(this.input.username);
    axios
      .post("http://localhost:5000/login", {
        email: this.input.username,
        password: this.input.password
      })
      .then(function(data) {
        console.log(data);
      })
      .catch(function(error) {
        console.log(this.input.username);
      });
  }
}

記錄第一個this.input.username有效，但在那之后，我不知道如何訪問數據。 this似乎是未定義的。

Uncaught (in promise) TypeError: Cannot read property 'input' of undefined

我不知道為什么這里的上下文會this變化，也不知道如何訪問我的數據。 任何人都可以向我解釋發生了什么並幫助我解決這個問題嗎？

Answer 1

在回調中，您必須綁定它或使用箭頭 function：

  .then(function(data) {
         console.log(data);
      })

至

  .then((data) => {
    console.log(data);
    console.log(this);
  })