0

As you all know, in a normal dropdown, you can get the value of it onchange with onChange={e => this.setState({ whatever: e.target.value })}. The thing is, in Fluent UI React, this does not work, since it has a custom value handling system. In the Fluent UI docs it says to link the onChange function to:

const onChange = (event: React.FormEvent<HTMLDivElement>, item: IDropdownOption): void => {
    setSelectedItem(item);
  };

My project has to be TypeScript free because it is integrating with another application in a special way. Is there any way to get the value of this dropdown onChange rather than use Typescript?

Thanks!

Liightninggod
  • 65
  • 2
  • 7
  • 1
    I think you can just provide a plain js function `(event, value) => {./* Do what you want */ }` – known-as-bmf Jul 27 '20 at 19:41
  • If I console.log the value of value and event after creating a plain js function both value and event are ```[object Object]```. Is this normal? How would I pass the props to the function? ```onChange={this.onChange}``` is how I am getting to the JS function. Is this wrong? @known-as-bmf – Liightninggod Jul 27 '20 at 19:59
  • Sike i played with it some more and you got it @known-as-bmf! Thanks bro! (That was a genderless bro) – Liightninggod Jul 27 '20 at 20:04

1 Answers1

1

You can call the callback function on onChange of the Dropdown and pass event and option as two argument to the callback.

For Example

onChange = (event, option) => {
}
JonasMH
  • 1,145
  • 11
  • 21
Mustafa Adenwala
  • 26
  • 1