Vue + TypeScript + Element + Axios 编辑器标红

Question

刚开始尝试用TS + Vue 开发，遇到些问题需要请教～
1.

<template>
  <div>
    <el-popover
      ref="popover"
      placement="top-start"
      title="标题"
      width="200"
      trigger="hover"
      content="测试内容">
      <el-button slot="reference">hover 激活</el-button>
    </el-popover>

    <el-button @click="clickEvent">点击触发popover弹出</el-button>

    <my-component ref="mycomp"></my-component>
  </div>
</template>

<script lang="ts">
import { Vue, Component } from 'vue-property-decorator'
import { ElPopover } from 'element-ui/types/popover'
import MyComponent from '@/components/MyComponent.vue'

@Component({
  components: {
    MyComponent
  }
})
export default class Login extends Vue {
  public $refs!: {
    popover: ElPopover,
    mycomp: MyComponent
  }

  clickEvent () {
    this.$refs.popover.doClose()
    this.$refs.mycomp.handleClick()
  }
}
</script>

如上测试代码。clickEvent 方法中第一行调用popover的doClose()是标红的，因为 ElPopover 中的声明文件中不存在这个方法。而自己写的MyComponent组件则可以通过类似的方式调用组件内部的handleClick()方法。那么请问，如何通过this.$refs.popover的方式调用element-ui popover 内部的方法？

2.

对于这种 Axios 中声明文件不存在的字段要如何处理？

Answer 1

any大法好，或者重新声明一个interface

Answer 2

1. popover是通过改变visible属性来控制显示和隐藏，不要直接操作DOM
2. axios的改一下,因为axios多包了一层

const response = await this.$http({});
const {code,data,result} = response.data;