Javascript 聚合物内部函数不是函数错误

Question

我在聚合物中定义了一个 javascript 函数： myTest(arg) {<do stuff here>}

在此函数中，根据某些条件，我想将聚合物模板中定义的按钮的 onclick 更改为其他函数。为此，我正在做 document.getElementById('myButton').onclick = function() {myTest('someArg')};

我遇到的问题是，当调用上述行时出现错误

Uncaught TypeError: myTest is not a function.

如果我在声明函数时尝试使用 function 关键字，编译器会抱怨

Unexpected token. A constructor, method, accessor, or property was expected.

更改按钮的 onclick 函数的正确语法是什么？

Answer 1

如果没有看到完整的源代码示例，很难确定，但听起来您面临的问题与 JavaScript not inferring this as the context for以与例如相同的方式调用实例方法Java 确实如此。让事情变得更复杂的是，this 不会在您为点击侦听器创建的 function 中包含预期值。

一种解决方法是使用箭头函数，因为它们不会重新定义执行上下文：

document.getElementById('myButton').onclick = () => { this.myTest('someArg') };

另一种方法是将 this 显式捕获到一个单独的变量中，然后在函数内部使用该变量：

var self = this;
document.getElementById('myButton').onclick = function() { self.myTest('someArg') };

Javascript 聚合物内部函数不是函数错误

Javascript function inside polymer is not a function error

javascript

polymer

polymer-2.x

vaadin-flow