Javascript Vuejs箭头函数未触发第二条语句

我在Vuejs组件的“方法”部分中使用lambda表达式

下面是一个例子 我触发

alertyou（）

并获取警报，单击OK。然后在vue开发人员工具中，我看到

这个.激活的
变成
真的

export default {
  name: 'HelloWorld',
  data () {
    return {
      msg: 'Welcome to Your Vue.js App',
      activated: false
    }
  },
  methods: {
      alertme: () => { alert('Clicked'); this.activated = false; },
      alertyou() {
        alert('Alert You');
        this.activated = true
      }
  }
}

但是，当我单击触发
alertme
lambda的按钮时。如果收到警报消息，请单击“确定”。但这一切都是真的

这里发生的是什么？这是lambdas的限制吗？每个lambda只能触发一条语句吗？或者，一旦触发警报，这必须处理范围吗？
将
alertme:（）=>{alert（'Clicked'）；this.activated=false；}
更改为
alertme（）{alert（'Clicked'）；this.activated=false；}
。您可以看到一个工作示例
将
alertme:（）=>{alert（'Clicked'）；this.activated=false；}
更改为
alertme（）{alert（'Clicked'）；this.activated=false；}
。您可以看到一个工作示例

这里发生的是什么？这是lambdas的限制吗？每个lambda只能触发一条语句吗？或者，一旦触发警报，这是否必须处理范围

两者都不是

arrow函数将此
绑定到创建arrow函数时的上下文。在这种情况下，
此
不是vue实例。可能是
窗口

使用function关键字（或ES6对象速记样式）在对象上声明的函数通常将
此
绑定到声明函数的对象

这就是为什么您可以在
alertyou
上访问
this.activated
，但不能访问
alertme

您需要使用与
alertyou
相同的语法来声明
alertme
方法

这里发生的是什么？这是lambdas的限制吗？每个lambda只能触发一条语句吗？或者，一旦触发警报，这是否必须处理范围

两者都不是

arrow函数将此
绑定到创建arrow函数时的上下文。在这种情况下，
此
不是vue实例。可能是
窗口

使用function关键字（或ES6对象速记样式）在对象上声明的函数通常将
此
绑定到声明函数的对象

这就是为什么您可以在
alertyou
上访问
this.activated
，但不能访问
alertme

您需要使用与
alertyou
相同的语法来声明
alertme
方法
 不，箭头函数不限于在中只有一条语句。更改console.log的警报并再次测试它-不要使用警报，因为它是阻塞语句。@WaldemarIce
alert
不会阻止执行任何操作。问题在于，使用arrow函数将
此
绑定到父作用域，而父作用域不是Vue实例。他应该将
alertme
定义为一个常规函数（或者像他对
alertyou
那样使用速记）。他不需要显式地绑定到
这个
@thanksd阅读上面的评论。我知道他哪里有问题——范围问题。你们错了，警报是代码阻塞语句。如果你调用它，代码执行实际上是暂停的。Ups，我错了：）但是警报是阻塞的：）JS中两个阻塞错误之一：）其他一切都是非阻塞的：）@WaldemarIce我明白你的意思了。是，
警报
将暂停脚本执行。但是，在解除警报后，将调用
alertme
函数的其余部分。我想你是说不会。不，箭头函数不限于只有一条语句。更改console.log的警报并再次测试它-不要使用警报，因为它是阻塞语句。@WaldemarIce
alert
不会阻止执行任何操作。问题在于，使用arrow函数将
此
绑定到父作用域，而父作用域不是Vue实例。他应该将
alertme
定义为一个常规函数（或者像他对
alertyou
那样使用速记）。他不需要显式地绑定到
这个
@thanksd阅读上面的评论。我知道他哪里有问题——范围问题。你们错了，警报是代码阻塞语句。如果你调用它，代码执行实际上是暂停的。Ups，我错了：）但是警报是阻塞的：）JS中两个阻塞错误之一：）其他一切都是非阻塞的：）@WaldemarIce我明白你的意思了。是，
警报
将暂停脚本执行。但是，在解除警报后，将调用
alertme
函数的其余部分。我想你是说不会。代码中的一点解释肯定会有帮助。当然：正如上面在主要帖子的评论中提到的@thanksd，箭头函数将
this
绑定到父范围，在本例中，父范围不是Vue实例。正因为如此，您需要使用一个普通的Javascript函数，您可以使用
函数alertme（）{}
初始化它，或者正如您在上面看到的
alertme（）{}
这是一个ES6快捷方式。在代码中进行一点解释肯定会有所帮助。当然：正如@thanksd在主要帖子的评论中提到的，箭头函数将
此
绑定到父作用域，在本例中，父作用域不是Vue实例。正因为如此，你需要使用一个普通的Javascript函数，你可以使用
函数alertme（）{}
初始化它，或者你可以看到上面的
alertme（）{}
是ES6的快捷方式。我现在就知道了，但是，我如何继续使用箭头函数语法？为什么要这样做？@christopherclark坏消息是，您根本无法使用箭头函数在Vue实例上定义这样的方法。关于iss的vue相关SO标记有很多问题