PDA

View Full Version : Strange behaviour of BadgeText



emaze
27 Nov 2017, 12:37 AM
Hi,
I created an example to explain a strange behaviour I have on BadgeText.
In MyExample component I have a button with an handler on click that will increment a counter.
On the tabpanel and on the button I have two similar BadgeTexts with the same binding to the counter.
When I click on the button I expect the counter to increment and the BadgeTexts to update with the new value.
What I got instead was that the counter was incremented (verified logging its state) and only the BadgeText on the button got its value updated.
I tried to bind a panel title to the same counter and it got updated, it's just the BadgeText that will stay unmodified.
Did I miss something or it is a bug?


import React, { Component } from 'react';
import { launch } from '@extjs/reactor';
import { Container, TabPanel, Button, Panel } from '@extjs/ext-react';

export default class MyExample extends Component {

constructor(props) {
super(props)
this.state={
counter:1
}
}

handle=(btn) => {
var counter=this.state.counter
counter++
this.setState({
counter: counter
})
}
render() {
console.log(this.state.counter)
return (
<Container>
<Button text='button' handler={this.handle.bind(this)} badgeText={this.state.counter}/>
<TabPanel
shadow
flex={1}
defaults={{
tab: {
minWidth: 130
}
}}
>
<Panel title={'panel title'+this.state.counter} badgeText={this.state.counter}/>
</TabPanel>
</Container>
)
}

}

launch(<MyExample />);

emaze
12 Dec 2017, 2:53 AM
Any updates please?