Ayush
Ayush

Reputation: 143

Have to make synchronous calls from Button onClick in React

I have button which is making two calls in onClick, a function resetFilterItems which resets the filter in my state and simultaneously my getNetworkViewData is also api is also called.

I am not able to reset my filters firsts so making a call with incorrect payload. How can I first reset the filters props.filterStatus, props.filterCapabilities and then make a call synchronously in this situation?

               <Button
                type="secondary"
                onClick={() => {
                  props.resetFilterItems(
                    props.filterStatus,
                    props.filterCapabilities
                  );
                  props.getNetworkViewData(
                    getSearchQueryParam(),
                    props.partnerId
                  );
                }}
                size="medium"
              >
                Clear all
              </Button>

Upvotes: 2

Views: 307

Answers (1)

sushildlh
sushildlh

Reputation: 9056

Try to call your another method in the resetFilterItems in this method.

So that way your state will clear and you can call another method after that.

Or share those 2 methods to get an idea more about your code flow.

You can use useEffect with your state dependencies. And call your Api in useEffect whenever you change your state.

useEffect(()=>{
                 props.getNetworkViewData(
                    getSearchQueryParam(),
                    props.partnerId
                  );
},[props.filterStatus])

Or you want to reset your states after API call then reset them in API response method.

Upvotes: 1

Related Questions