vue3-select2-component modal issue

[yasirmehmood123]

I am working with vue3-select2-component, it works fine on any page but when things come to bootstrap modal vue3-select2-component does not work fine for it like, no searching, no select option nothing can you guys help me out how to fix this. I am struggling on this issue from last couple of days but couldn't found any solution yet will be waiting some good response from you guys. Thanks

[w-mazed]

Hi @yasirmehmood123 I resolved this issue with after reading this : https://select2.org/troubleshooting/common-problems

So now what you have to do is to define a modal variable in your component like :

let modal = ref();

onMounted(() => {
    modal.value = document.getElementById('my_modal_html_id');
});

return {
    modal
};

Then use it in settings bind such as :

<Select2  :settings="{ dropdownParent: modal }"
    ....
>
</Select2>

Works fine for me, hope for you too :)