Vue：延迟选项不适用于 v-popover

Question

我使用 v-tooltip 创建一个可点击的弹出窗口。我希望弹出窗口保持可见几秒钟，即使鼠标同时离开弹出窗口和触发它的元素（我的示例中的按钮）。

这是我的代码中的一个简化示例：

<v-popover trigger='hover' delay='{ show: 250, hide: 5000 }'>

    <!-- Popover target -->
    <button type='button'>x</button>

    <!-- Content of popover -->
    <template slot='popover'>
        <p>###</p>
    </template>
</v-popover>

我的问题是 delay 属性没有任何作用。 trigger='hover' 正在运行（否则弹出窗口只会在单击时显示），但一旦我将鼠标移开，弹出窗口就会消失。它不应该保持可见 5 秒吗？

Answer 1

您忘记了 :delay 之前的冒号。所以你传递的只是一个字符串而不是一个对象。

Vue.use(VTooltip)

new Vue({el: '#app'})

<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.17/vue.js"></script>
<script src="https://unpkg.com/v-tooltip"></script>
<div id="app">
  <div>
    <v-popover trigger='hover' :delay='{ show: 250, hide: 5000 }'>
      <!-- Popover target -->
      <button type='button'>x</button>
      <!-- Content of popover -->
      <template slot='popover'>
        <p>###</p>
    </template>
    </v-popover>
  </div>
</div>

Vue：延迟选项不适用于 v-popover

Vue: Delay option not working with v-popover

javascript

popover

vue.js

vuejs2