Disable call to getValue when MDBSelect is passed new options

[aviskarkc10]

I am using the multi select component with arrays to use as filters on my page. So whenever an option is selected, an api call takes place to fetch data.

I have multiple filters like these which work fine.

But when I first load the page then the select component calls the getValue function gets called, causing my api to be called multiple times. Any way to override this functionality?

[jakubchmura]

Hi @aviskarkc10

I don't know where and how you sending a call to fetch the data. Can you tell me? Maybe if you will call the fetch at componentDidMount it will run only once, and then try to use it as you do it now then it will be ok.

But without your code, I can't propose any solution.

Best, Kuba

[aviskarkc10]

Okay let me give you a brief overview of how it looks:

this.state = {
   options: [],
   data: []
}
componentDidMount() {
   this.fetchOptionsForSelectComponent() // api call to fetch options
}

fetchData = () => {
   // function to fetch data based on selected options in MDBSelect
}

getValue = () => {
   // this function is called when new selection takes place in MDBSelect
   this.setState(() => {
       // set the value of newly selected options
  }, () => {
      this.fetchData();
 })
}

The problem is I have 3 select components. All of them are passed data asynchronously, so initially every select component will receive [] as values, but when the promise inside componentDidMount resolves, new options are sent to the MDBSelect component.

When they first receive the new options, all of them fire getValue function and because I have this.fetchData in setState's callback, 3 extra api calls are made.

For now I have resolved the issue by using a boolean value. But shouldn't the getValue function be called only when a select action takes place rather than whenever options are changed also?

[pglejzer]

We will re-write the select component and we will look into this problem with getValue. So if you resolved your problem by using a boolean value I will close this and add a new task to our list to do. Have a nice day.