如何解决ts无法识别vue中的$refs

ue中$refs可能会返回一个vue对象或者是Element对象，但是typescript并不知道这是个什么玩意儿，怎么解决这个问题呢？

解决办法是我们手动指定其类型，例如有一个ScrollView.vue组件，我在父组件中引用它。

<template>
  <scroll-view ref="scrollView"></scroll-view>
</template>

如下方式引用即可。

import ScrollView from './path/ScrollView.vue'

(this.$refs.scrollView as ScrollView).someMethod()

如果它不是一个Vue对象，而是一个Element对象的引用的话，可以这样来引用

(this.$refs.drag as HTMLElement).clientWidth

上面是一个办法，还有另一个解决的办法。就是在当前类中声明$refs所有引用。还是以上面例子中的对象为例。

export default class SomeClass extends Vue {
  public $refs!: {
    scrollView: ScrollView
  }
}

按照这个套路，把当前$refs所有可能引用到的都声明一下，再引用，ts就能正确识别了。