I have a multiselect dropdown in vuejs below:
<h4>Symptoms</h4>
<div class="select">
<multi-select
search
v-model="selected_symptoms_list"
:options="multiDropDownOptions"
:selectOptions="receivedData.symptoms_list"
:btnLabel="multiselectBtnLabel"
@selectionChanged="FilterBySelectedItem"
/>
<span class="select-highlight"></span>
<span class="select-bar"></span>
</div>
receivedData variable receives values through api call when page is loaded.
FilterBySelectedItem method calls api when some item is selected from the dropdown and it also receives the data in receivedData variable so the dropdown could be populated again with new values.
But using receivedData variable in two different api calls causing the event to trigger continuously and making api calls written insideFilterBySelectedItem.
Here is the doc for vue-multi-select
How can I tackle this problem.