含聚合物 2.0 的铁形态

Question

我有一个错误，我在 jsbin 中复制了这个错误：https://jsbin.com/micinalacu/1/edit?html,console,output

铁形式，提交serialize方法时return总是undefined，调用了两次

 <dom-module id="my-form">
  <template>

    <iron-form id="myForm">
      <form method="get" action="cenfdsas">
        <input type="text" name="cenas">
        <button on-click="cenas">Submit</button>
      </form>
    </iron-form>

  </template>

  <script>
   class MyForm extends Polymer.Element {

      static get is() {
        return 'my-form';
      }

      connectedCallback() {
        super.connectedCallback();
        const form = this.$.myForm;
        form.addEventListener('iron-form-presubmit', function (event) {
          event.preventDefault();
          console.log("here")
          console.log(form.serialize());
        });
      }

      cenas() {
        this.$.myForm.submit();
      }

    }

    window.customElements.define(MyForm.is, MyForm);

  </script>
</dom-module>

更新

Polymer 团队需要将方法的名称更改为 serializeForm，因为他们有一个错误。资料来源：https://github.com/PolymerElements/iron-form/issues/174

但是我继续讨论提交事件被调用了两次的问题错误 --> https://jsbin.com/koyelafeze/1/edit?html,console,output

Answer 1

根据 the documentation，在表单中使用标准 <button> 元素将自动提交。

然后您应该按照 link 中的建议使用 <paper-button>，或者评论 cenas() 方法的内容。

JS Bin example

含聚合物 2.0 的铁形态

Iron form with polymer 2.0

javascript

web-component

polymer

iron-form

更新