解决vue+typescript中父组件调用子组件报错

非Typescript下

子组件

//methods
consoleLog() {
  console.log('hello world');
  return '这里是子组件'
}

父组件

<Child ref="child">
	parent
</Child>

//methods
getChild(){
    let data = this.$refs.child.consoleLog() // data为返回值这里是子组件
}

Typescript下

子组件不变

//methods
consoleLog() {
  console.log('hello world');
  return '这里是子组件'
}

父组件

<Child ref="child">
	parent
</Child>

import Child from '@/components/Child.vue'
//methods
getChild(){
    // as Child 将this.$refs.child断言为引入的子类类型
    let data = (this.$refs.child as Child).consoleLog() 
}

typescript下直接使用 refs.child.方法 时，typescript预处理时找不到这个方法所以报错

解决方法为把数据断言成----子类类型