vue.js - 单击外部时防止下拉关闭

Question

我在里面创建了一个带有 CInput 的 CDropdown。当我在外部单击时，我不希望下拉菜单自动关闭，因为我想将文本复制到某处并粘贴到 CInput。这个怎么可能？谢谢你的帮助。

<CDropdown :show.sync="isShow">
  <template>
    <CInput 
      label="Sample label"
      type="text" />
  </template>
</CDropdown>

标签： vue.jscore-ui

Answer 1

最后我通过阅读 CDropdown 的源代码来做到这一点并做解决方法：

首先，将 ref 设置为 CDropdown：

<CDropdown ref="refDropdown" :show.sync="isShow">

然后重写 CDropdown 的 hide() 函数，一定要调用 $forceUpdate() 来更新 CDropdown 的指令：

this.$refs.refDropdown.hide = function() {
  console.log("Prevented hide");
}
this.$refs.refDropdown.$forceUpdate();