2017-03-07 9 views
0

벨로우즈처럼 여러 버튼이 있습니다.Polymer, paper-button, on-tap 인수를 전송하지만 때때로 작동하지 않습니다.

<teplate is="dom-if" if="{{google}}"> 
    <paper-button on-tap='_signIn' arg="#google">...<div></div><paper-button> 
</template> 
..... 
<paper-button on-tap='_signIn' arg="#facebook">...<div></div><paper-button> 
<paper-button on-tap='_signIn' arg="#twitter">...<div></div><paper-button> 

...... 
_signIn: function(e) { 
console.log(e.target.getAttribute("arg")); 
} 

인수의 가치로 인해 자체 자격 증명으로 로그인해야합니다. 해당 단추를 임의로 클릭하면 결과가 때때로 null입니다. 콘솔 로그는 다음과 같습니다.

#google 
#facebook 
#google 
null 
null 
null 
#facebook 
#facebook 
#facebook 
#twitter 
null 

안정적인 결과가 필요합니다. 어떤 도움이나 제안이라도 대단히 감사하겠습니다. DIV 더 arg 속성과 e.target 반환 div 전화가 없기 때문에 paper-button 내부 div 클릭

답변

1

.. 분명히 널 (null)가 발생합니다. 당신은 같은 자식 요소가없는 종이 단추를 표시해야합니다

<paper-button on-tap='_sigIn' arg="#google">Click me</paper-button> 

또는 루프 부모를 축복하는 것이다 함수를 만들기는 주어진 속성을 찾을 때까지. 이를 위해 내가 사용하고 있습니다 : 같은

getAttr: function(e,attr) { 
    elem = e.target; 

    while (elem.parentNode != undefined) { 
     if (elem.getAttribute(attr) != undefined) { 
      return elem.getAttribute(attr); 
     } 
     elem = elem.parentNode; 
    } 
}, 

그래서, 함수 _signIn 캔 같습니다

_sigIn: function(e) { 
    var value = this.getAttr(e, "arg"); 
    console.log(value); 
} 
+0

가 대단히 @Kuba 시모 노브 스키 감사, 두번째 옵션은 나에게 더 잘 작동합니다. 정말 큰 도움이됩니다. :) – HakanC