组件引用的 Vuejs 类型

Question

我有以下场景：我这里有一个组件：

<div class="border shadow p-2">
    <chart :config="barConfig" ref="linechart" />
</div>

现在我可以像这样访问它了：

let linechart = ref(null)

事实是，linechart 不仅仅是一个普通的 HTML 元素。通常我会做类似的事情：

let linechart = ref<HTMLElement>()

但它实际上是一个组件。我可以使用

访问它的方法

linechart.value.update()

但是打字稿给我一个错误 update() 不存在。我试过这个：

import chart from "@/components/chart/chart.vue";
let linechart = ref<typeof chart>();
linechart.value.update();

但还是没有运气。有没有办法在没有打字稿错误的情况下获取暴露的方法？

需要说明的是，.update() 方法有效。它只是找不到方法的打字稿。我该如何解决？

Answer 1

我发现了。它实际上写在文档中。

这很完美：

import chart from "@/components/chart/chart.vue";

let linechart = ref<InstanceType<typeof chart>>();
linechart.value?.update();

Vuejs types for component refs