鐵形式addEventListener爲空

但是這個問題從來沒有得到答案。

我想對addEventListener鐵形式，如：

我的HTML進口：

<link rel="import" href="/bower_components/polymer/polymer.html"> 
<link rel="import" href="/bower_components/iron-ajax/iron-ajax.html"> 

<link rel="import" href="/bower_components/iron-form/iron-form.html"> 
<link rel="import" href="/bower_components/paper-input/paper-input.html"> 
<link rel="import" href="/bower_components/paper-button/paper-button.html"> 
<link rel="import" href="/bower_components/paper-spinner/paper-spinner.html">

形式：

<form is="iron-form" method="get" action="/" id="eventsDemo"> 
     <paper-input name="name" label="Name" required auto-validate></paper-input> 
     <paper-input name="password" label="Password" type="password" required auto-validate></paper-input> 
     <paper-checkbox name="read" required>You must check this box</paper-checkbox> 
     <br> 
     <paper-button raised onclick="_delayedSubmit(event)" disabled id="eventsDemoSubmit"> 
      <paper-spinner id="spinner" hidden></paper-spinner> 
      Submit 
     </paper-button> 
     <paper-button raised onclick="_reset(event)">Reset</paper-button> 
     <div class="output"></div> 
    </form>

和聽衆：

document.getElementById('eventsDemo').addEventListener('iron-form-submit', function (event) { 

    });

但是，我也得到了錯誤 -

Uncaught TypeError: Cannot read property 'addEventListener' of null

我已經嘗試了一些建議與window.onload，或WebComponentsReady。沒什麼幫助。

來源

2017-06-16 AHahn

如果是這種聚合物2.0，你應該試着去'this.shadowRoot.getElementById（「eventsDemo」）'，而不是 – codeMonkey

是的，這是聚合物2，謝謝，我在類的構造函數嘗試這樣做，控制檯說斜面讀取屬性的getElementById的空值。看起來像這樣.shadowRoot沒有設置。 – AHahn

也許你錯過了一個}或涼亭安裝

來源

2017-06-16 19:59:42

我找到了解決辦法：

我定義在錯誤的地方的addEventListener，它需要與在connectedCallback的shadowRoot（）。

class UserApp extends Polymer.Element { 
     static get is() { 
      return 'user-app'; 
     } 

     connectedCallback() { 
      super.connectedCallback(); 

      let eventsDemo = this.shadowRoot.getElementById('eventsDemo'); 
      let eventsDemoSubmit = this.shadowRoot.getElementById('eventsDemoSubmit'); 

      eventsDemo.addEventListener('iron-form-submit', function (event) { 
       console.log("iron form submit"); 

       eventsDemoSubmit.disabled = false; 
       this.querySelector('.output').innerHTML = JSON.stringify(event.detail); 
      }); 

      eventsDemo.addEventListener('change', function (event) { 

       eventsDemoSubmit.disabled = !eventsDemo.validate; 
      }); 
     }

來源

2017-06-17 19:58:18 AHahn

鐵形式addEventListener爲空

回答

相關問題