使用打字稿关闭bootstrap-vue模态

Question

我有一个bootstrap-vue模态，并尝试在我的点击功能中将其关闭。

this.$refs['my-modal'].hide()

但出现以下错误：

Property 'hide' does not exist on type 'Vue | Element | Vue[] | Element[]'.
Property 'hide' does not exist on type 'Vue'

我也尝试过使用jQuery

$('#my-modal').modal('hide');

有错误：

Property 'modal' does not exist on type 'JQuery<HTMLElement>'

Answer 1

当refs在Vue+Typescript中对我不起作用时，我有时将ref强制转换为HTMLElement或通过使用any禁用类型检查。 / p>

(this.$refs['my-modal'] as HTMLElement).hide()
(this.$refs['my-modal'] as any).hide()

Answer 2

使用最新版本的BootstrapVue（2.0.0-rc.21 +），您可以使用更新的this.$bvModal.hide(id)方法来关闭具有指定id的模式。 $bvModal已输入，因此它可以与Typescript一起正常使用。