Hi there,
I observe a strange behaviour in the paper-tabs ontap listener: When I
register listeners on a "paper-tabs" menu, changing the tabs selection bar
color, the color does not change on the first, but only on the second click
on a tab. This means that the color change on the selection bar always lags
exactly one click behind - so e.g. when I click on Tab-1 first, and then on
Tab-2, the color change of Tab-1 is applied first and only after a second
click on Tab-2, the correct Tab-2 specific color is applied.
For the menu itself I made a component like this which uses the
{{selected}} variable to specify the currently selected tab:
<dom-module id="yosovo-menu">
<template>
<paper-tabs id="my_menu" noink selected={{selected}}>
<paper-tab id="tab1">Tab-1</paper-tab>
<paper-tab id="tab2">Tab-2</paper-tab>
<paper-tab id="tab3">Tab-3</paper-tab>
</paper-tabs>
</template>
<script>
My_Menu = Polymer({
is: 'my-menu',
properties: {
selected: Number,
value: 0
},
listeners:{
'my_menu.tap': 'handleMenuTap'
},
handleMenuTap: function(e) {
console.info("HandleMenuTap happened");
console.info(this.selected);
if(this.selected == 0){
this.customStyle['--paper-tabs-selection-bar-color'] = 'red';
}
if(this.selected == 1){
this.customStyle['--paper-tabs-selection-bar-color'] = 'blue';
}
if(this.selected == 2){
this.customStyle['--paper-tabs-selection-bar-color'] = 'green';
}
this.updateStyles();
}
});
var my_menu = new My_Menu();
</script>
</dom-module>
In my index.html body, I call the menu like this:
<yosovo-menu selected=0></yosovo-menu>
I'm relatively new to Webcomponents and JavaScript in general. If you think
that this is not the right approach at all, please also tell me. ;)
Thanks in advance!
Constantin
Follow Polymer on Google+: plus.google.com/107187849809354688692
---
You received this message because you are subscribed to the Google Groups
"Polymer" group.
To unsubscribe from this group and stop receiving emails from it, send an email
to [email protected].
To view this discussion on the web visit
https://groups.google.com/d/msgid/polymer-dev/402aea2a-f7cb-4250-b1e3-25704bd58f64%40googlegroups.com.
For more options, visit https://groups.google.com/d/optout.
