javascript - 使用 Bootstrap-Vue 时，如何防止在单击嵌套的 b-​​input 组件时关闭 b-dropdown？

Question

我很确定我只是不明白如何实现 Vue 的 Event Modifiers .根据该文档，我所要做的就是添加以下内容:

<!-- the click event's propagation will be stopped -->
<a v-on:click.stop="doThis"></a>

以下是我如何将示例解释为我的哈巴狗代码:

b-dropdown(text="Actions")
  b-dropdown-item
    b-form(inline)
      .row
        .col
          b-input(@click.stop='' placeholder="#123")
          b-button(:href='printCheck' variant="primary") Print Check

它看起来很简单，但它并没有按预期工作。如果您需要更多支持信息，请询问。并随意调整标题；我不确定我的问题是 vue、bootstrap-vue 还是 javascript 问题。

提前感谢您的时间，
凯文

Answer 1

由于您正在单击一个组件，因此您应该将 .native 与 .stop 修饰符结合起来，如下所示:

 b-input(@click.native.stop='' placeholder="#123")

如果您使用的是简单的 HTML 元素，例如 input，您只能使用 .stop 修饰符:

 input(@click.stop='' placeholder="#123")