Javascript 聚合物2元素中的铁形态2.0：功能未定义

试图从聚合物2元素内部复制铁形态演示，但似乎无法使其工作

单击提交时，我得到

未捕获引用错误：\u delayedSubmit未定义

。有什么建议吗

JSBin：

代码：

<dom-module id="spp-login">
    <template>
        <iron-form id="loginForm">
            <form action="/login" method="post">
                <paper-input name="username" label="Username" required auto-validate></paper-input>
                <paper-input name="password" label="Password" required auto-validate></paper-input>

                <paper-button raised onclick="_delayedSubmit(event);" disabled id="loginFormSubmit">
                    <paper-spinner id="spinner" hidden></paper-spinner>
                    Submit
                </paper-button>
                <paper-button raised onclick="loginForm.reset();">Reset</paper-button>
            </form>
            <div class="output"></div>
        </iron-form>
    </template>

    <script>
      class SppLogin extends Polymer.Element {

        static get is() {
          return 'spp-login';
        }

        static get properties() {
          return {
            username: String,
            password: String,
          };
        }

        connectedCallback() {
          super.connectedCallback();
          const loginForm = this.$.loginForm;
          const spinner = this.$.spinner;
          const loginFormSubmit = this.$.loginFormSubmit;

          loginForm.addEventListener('iron-form-submit', (event) => {
            this.querySelector('.output').innerHTML = JSON.stringify(event.detail);
            spinner.active = false;
            spinner.hidden = true;
            loginFormSubmit.disabled = false;
          });
          loginForm.addEventListener('change', (event) => {
            loginFormSubmit.disabled = !loginForm.validate();
          });

          loginForm.addEventListener('iron-form-presubmit', (event) => {
            event.preventDefault();
            console.log('here');
          });
        }

        _delayedSubmit(event) {
          const loginForm = this.$.loginForm;
          const spinner = this.$.spinner;
          spinner.active = true;
          spinner.hidden = false;
          loginForm.disabled = true;
          // Simulate a slow server response.
          setTimeout(function() {
            loginForm.submit();
          }, 1000);
        }
      }

      window.customElements.define(SppLogin.is, SppLogin);
    </script>
</dom-module>

提交
重置
类SppLogin.Element{
静态get是（）{
返回“spp登录”；
}
静态获取属性（）{
返回{
用户名：String，
密码：String，
};
}
connectedCallback（）{
super.connectedCallback（）；
const loginForm=this.$.loginForm；
常量微调器=此。$.spinner；
const loginFormSubmit=this.$.loginFormSubmit；
loginForm.addEventListener（'iron-form-submit'，（事件）=>{
this.querySelector（'.output'）.innerHTML=JSON.stringify（event.detail）；
spinner.active=false；
spinner.hidden=true；
loginFormSubmit.disabled=false；
});
loginForm.addEventListener（'change'，（事件）=>{
loginFormSubmit.disabled=！loginForm.validate（）；
});
loginForm.addEventListener（'iron-form-presubmit'，（事件）=>{
event.preventDefault（）；
console.log（'here'）；
});
}
_延迟提交（事件）{
const loginForm=this.$.loginForm；
常量微调器=此。$.spinner；
spinner.active=true；
spinner.hidden=false；
loginForm.disabled=true；
//模拟缓慢的服务器响应。
setTimeout（函数（）{
loginForm.submit（）；
}, 1000);
}
}
window.customElements.define（SppLogin.is，SppLogin）；

当使用纸张按钮触发事件时，您必须在单击时使用

，并且不能指定参数

因此正确的语法应该是
on click=“\u delayedSubmit”
要将事件侦听器添加到DOM元素，必须在模板中使用on event注释。
此外，无论您是否为
事件
对象提供名称，
事件
对象都已被传递到回调。
Polymer
不支持在事件属性中传递参数

iron表单
demo页面中显示的示例使用的是
demo片段
，它既适用于原生元素，也适用于聚合物元素

因此，您需要从以下位置更改代码：
onclick=“\u delayedSubmit（event）；”
到：
on click=“\u delayedSubmit”
在下面的帮助下，我已将代码更正为应该执行的操作。上面的代码中还有其他错误。固定代码如下：