Buefy: Feature request: Open/Close Dropdown Programmatically

[keligijus]

Description

I've got a use case where I need to close the Dropdown programmatically and a way to check if it is open.

Is this feature worthwhile and how could we implement it?

[rafaelpimpa]

<b-dropdown ref="dropdown" @active-change="activeChanged">[...]</b-dropdown>

Check if it's active with the active-change event or by the isActive property.

Toggle with the toggle() method (available in v0.4.4) (that will be published in a few minutes):

this.$refs.dropdown.toggle()

Disable with the isActive = false property:

this.$refs.dropdown.isActive = false

[AlexVFornazieri]

Hello guys,

I am trying use toggle function like @rafaelpimpa exemplify, but something weird happens, the log display an error said toggle is not a function.

Uncaught TypeError: this.$refs.playitemDropdown.toggle is not a function

In that case 'playitemDropdown' is the ref of my b-dropdown element.

My env
Buefy version: 0.5.4;
Vue version: 2.5.13;

[grebebird]

@rafaelpimpa Question on this fix: It seems like if the b-dropdown is "hoverable", then toggle (to programmatically close the menu) is ignored.

My use-case is this: I want my menu to me hoverable on desktop, but clickable on mobile. That's actually handled ok (it doesn't do a modal on mobile, but it allows me to click on it instead, which is great). However, on mobile, when a menu item is clicked, the menu doesn't close (and it does on desktop because I'm no longer hovering over it), even when we do an @click.native="closeMenu" and try to do so programmatically, like you've done above.

Thoughts on why it doesn't work?
https://codepen.io/anon/pen/mxxaXr?editors=1010