[CDropdown] Not closed after click on CDropdownItem

[darthf1]

I have a dropdown on my Header component where the user can select a language:

<c-dropdown toggler-text="Language">
  <c-dropdown-item :to="switchLocalePath('nl')">Dutch</c-dropdown-item>
  <c-dropdown-item :to="switchLocalePath('en')">English</c-dropdown-item>
</c-dropdown>

The switchLocalePath function is from nuxt-i18n and returns a string, which is in this case the route with a different language. On click, the user is direct to another page, but the dropdown stays in place, opened. Below are the events emitted; the first one is from opening the dropdown and the second is after clicking on the dropdown item.

Generated HTML:

<div class="dropdown show">
    <button type="button" aria-expanded="true" aria-haspopup="true" class="btn dropdown-toggle">Language</button><!---->
    <div class="dropdown-menu show" style="margin: 0px; position: absolute; inset: 0px auto auto 0px; transform: translate(0px, 35px);" data-popper-placement="bottom-start">
        <a href="/" class="dropdown-item router-link-active" role="menuitem" target="_self">Dutch</a> 
        <a href="/en" class="dropdown-item router-link-exact-active router-link-active" role="menuitem" target="_self">English</a>
    </div>
</div>

"@coreui/coreui": "3.0.0",
"@coreui/vue": "3.0.5",

The documentation mentions the usage of router link props. If i change :to to :href the dropdown closes, but then the page is fully refreshed (as is expected).

[woothu]

Thank you for the report! The issue is fixed in 3.0.6 version.