When clicking a datebox, the onFocus even fires twice, and fires another 2 times when either closing the drop down or selecting a date, which really it shouldn't fire at all for those actions.
Example:
import React from 'react';
import { DateBox } from 'rc-easyui';
class App extends React.Component {
constructor() {
super();
this.state = {
value: new Date(),
}
this.times = React.createRef();
this.times.current = 0;
}
formatDate(date) {
let y = date.getFullYear();
let m = date.getMonth() + 1;
let d = date.getDate();
return [m, d, y].join('/')
}
handleChange(value) {
this.setState({ value: value })
}
handleFocus(){
console.log("focus",this.times.current)
this.times.current++;
}
render() {
return (
<div>
<h2>Restrict Date Range in DateBox</h2>
<p>This example shows how to restrict the user to select only ten days from now.</p>
<DateBox
panelStyle={{ width: 250, height: 300 }}
editable={false}
value={this.state.value}
onChange={this.handleChange.bind(this)}
onFocus={this.handleFocus.bind(this)}
/>
<p>{this.formatDate(this.state.value)}</p>
</div>
);
}
}
export default App;