为什么XMLHttpRequest（）看不到外部变量？

Question

此变量在data内部定义：

data () {
  return {
    isSent: false,
    (...)

尝试在此处调用方法时：

methods: {
  sendEmail () {
    let isSent = this.isSent

    const xhr = new XMLHttpRequest()
    xhr.onreadystatechange = function () {
      if (xhr.readyState === 4 && xhr.status === 200) {
        console.log(xhr.responseText)
        this.isSent = true
(...)

linter表示定义了一个未使用的变量。当我删除let isSent...初始化时，linter会说到未定义的变量。

我看到了与JS闭包相关的问答，但是那里的信息虽然有用且广泛，但是却非常笼统，不能解决像这样的更具体的问题。

如何从xhr函数内部获取变量？

Answer 1

this不是您想的那样。将函数更改为箭头函数，它应将this的上下文保留为您所期望的。

xhr.onreadystatechange = () => {
    if (xhr.readyState === 4 && xhr.status === 200) {
        console.log(xhr.responseText)
        this.isSent = true
...

有关箭头功能的更多信息，请参见documention on MDN