国产av日韩一区二区三区精品,成人性爱视频在线观看,国产,欧美,日韩,一区,www.成色av久久成人,2222eeee成人天堂

So ?ffnen Sie das Auswahl-Dropdown beim Hover mit Bootstrap Vue
P粉635509719
P粉635509719 2024-03-26 14:04:58
0
1
692

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.

P粉635509719
P粉635509719

Antworte allen(1)
P粉222320176

根據(jù)我的理解,您想在 mouseovermouseleave 事件上顯示/隱藏 <b-form-select> 。如果是,我有一些建議

  • 使用 div 作為包裝器,這將觸發(fā) mouseovermouseleave 事件。我們可以通過(guò)在其自身附加 native 來(lái)直接觸發(fā)鼠標(biāo)事件,但一旦隱藏,將無(wú)法再次在鼠標(biāo)懸停時(shí)恢復(fù)下拉列表。
  • 您可以通過(guò) 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"/>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage