奇怪的行为：vue-multiselect 选项面板的显示导致按钮无法点击

Question

代码沙盒：https ://codesandbox.io/s/vue-template-33327

重现步骤

1. 单击 vue-multiselect 以显示选项面板

2. 选择几个选项

3. 单击“不可点击的提交”按钮

4. 观察奇怪的行为

正如我们所见，“不可点击提交”按钮是不可点击的。只有当 vue-multiselect 失去焦点时才可点击（选项面板消失后）

有人可能会说，选项面板的出现导致按钮“不可点击”，然而，尽管选项面板仍然存在，“可点击提交”按钮仍然“可点击”。

其他人可能会说，因为“不可点击提交”按钮从其先前的位置移开导致点击事件处理程序不起作用。那讲得通。但是，我还创建了一个增加高度按钮，它会导致 div 增加其高度，以模拟按钮的位置变化。在这种情况下，“不可点击提交”是可点击的……奇怪！

另一个奇怪的事情是@mousedown 事件在“不可点击提交”按钮的情况下起作用。但是，在这种情况下，表单没有提交。

那种奇怪的行为完全让我大吃一惊。我不知道是什么导致了这些行为。哪位大侠知道是怎么回事，求帮忙！因为在一天结束时，我需要使“不可点击提交”按钮可点击。

更新 1

另一个问题，为什么@mousedown事件有效但@click事件没有？

更新 2

阻止按钮移动解决了这个问题，但是，尽管它已经从以前的位置移开了，但是否有可能使按钮仍然可点击？

Answer 1

答案比我想象的要简单，我只需要添加这一行：@mousedown.prevent到遇到问题的任何按钮。虽然我不知道到底发生了什么。