myxvisual / react-uwp

📱⌨ React Components that Implement Microsoft's UWP Design & Fluent Design.
https://react-uwp.com
MIT License
1.18k stars 78 forks source link

DropDownMenu running onChangeValue despite no changes #18

Closed renshenhe closed 7 years ago

renshenhe commented 7 years ago

If you click on the DropDownMenu and do not select anything or select the same value it will run the onChange function despite no changes causing unnecessary dispatches/rerenders when using redux.

I tried to remedy the issue by preventing any actions if the value is the same as currently selected:

handleValueChange = val => {
  if (this.state.selectedValue !== val) {
    this.setState({ selectedValue: val })
  }
}
<DropDownMenu
  defaultValue={this.state.selectedValue}
  values={this.state.values}
  onChangeValue={this.handleValueChange}
/>

The problem with this approach is that while it does prevent unnecessary onChangeValue runs it locks the component in a valueless state when you toggle the component and click outside the options. Pitfall of not using <select>/<option />?

myxvisual commented 7 years ago

@renshenhe Hi, i think this bug is fixed to v1.1.3, forget in the commit record it.