Ich brauche eine M?glichkeit, <select>
或 <b-form-select>
auszul?sen und beim Mouseover eine Dropdown-Liste mit Optionen anzuzeigen. Keine Verwendung von JQuery oder anderen externen Plugins als Vue.js.
根據(jù)我的理解,您想在 mouseover
和 mouseleave
事件上顯示/隱藏 <b-form-select>
。如果是,我有一些建議:
mouseover
和 mouseleave
事件。我們可以通過(guò)在其自身附加 native
來(lái)直接觸發(fā)鼠標(biāo)事件,但一旦隱藏,將無(wú)法再次在鼠標(biāo)懸停時(shí)恢復(fù)下拉列表。v-show
指令簡(jiǎn)單地顯示/隱藏下拉列表。我們可以輕松地通過(guò)鼠標(biāo)事件設(shè)置值。工作演示:
new Vue({ el: '#app', data() { return { selected: null, isVisible: true, options: [ { value: null, text: 'Please select an option' }, { value: 'a', text: 'This is First option' }, { value: 'b', text: 'Selected Option' }, { value: { C: '3PO' }, text: 'This is an option with object value' }, { value: 'd', text: 'This one is disabled', disabled: true } ] } }, methods: { onOver() { this.isVisible = true; }, onLeave() { this.isVisible = false; } } })
.wrapper-div { height: 20px; }
[email?protected]/dist/bootstrap-vue.css"/>