У меня есть следующий сценарий: здесь у меня есть компонент:
<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()
Но typescript выдает мне ошибку, что update()
не существует.
Я пробовал это:
import chart from "@/components/chart/chart.vue";
let linechart = ref<typeof chart>();
linechart.value.update();
Но все равно не повезло. Есть ли способ получить открытые методы без ошибки машинописного текста?
Чтобы было ясно, метод .update()
работает. Это просто машинопись, которая не может найти метод. Как это исправить?
Я узнал это. Это действительно написано в документах.
https://vuejs.org/guide/typescript/composition-api.html#typing-component-template-refs
Это работает идеально:
import chart from "@/components/chart/chart.vue";
let linechart = ref<InstanceType<typeof chart>>();
linechart.value?.update();