selimdoyranli / v-dropdown-menu Goto Github PK

Hi!

I would love to be able to style the container of the dropdown menu. Specifically, I would like to change the default CSS for min-width. Would it be an option for you to maybe add a property for us to set specific CSS classes for the container?

will there be support vue 3?

First - love the plugin. Nice work.

My only issue is when trying to add a dropdown-closer to an item with a @click attached it seems to stop it from working.

Below is my current code:

    <dropdown-menu withDropdownCloser transition="zoom" overlay:false>
      <button slot="trigger">{{ SortOption }}</button>
      <ul slot="body">
        <!-- Gets the sort options from the Store -->
        <li v-for="item in options" :key="item.id">
            <button @click="changeSortOption(item.name); dropdown-closer" class="text-black">
                {{ item.name }}
            </button>
        </li>
        <button>Close</button>
      </ul>
      <div slot="footer">Dropdown Footer</div>
    </dropdown-menu>

Any fix for this?

Hi again there.

I'm using Pug in my Vue project, and here is a snippet where I'm trying to use the withDropdownCloser property. I can simply not make it work. The dropdown won't close when I click on the router-link "Account".

dropdown-menu(direction="right" :overlay="false")
    span(slot="trigger") User
    .user-dropdown(slot="body")
        router-link.submenu-user(to="/account" :withDropdownCloser="true") Account
        span.submenu-user(@click="logout") Sign Out

Am I doing something terribly wrong here?

I would like to be able to programatically open and close to dropdown through a prop. It looks like there was an intension to be able to do this with the isOpen prop but there doesn't seem to be a watch in v-dropdown-menu on this prop.

A couple things need to happen to have this work. Add a 'none' mode so internally events won't be listened to and then add a watch for isOpen to open and close the drop down upon request