Vue Typescript：用类型声明数据

【问题标题】：Vue Typecript: declaring data with typeVue Typescript：用类型声明数据
【发布时间】：2020-08-06 17:44:09
【问题描述】：

如何在 Vue 中使用 Typescript 实现以下类似功能？

DocumentReference docRef = null

export default Vue.extend({
    ...
    ...
    data: function(){
        return {
            docRef: null, //**here
        }
    },
})

写docRef: null as DocumentReference 给出打字稿错误：

将 null 转换为 DocumentReference 类型可能是一个错误

我不想写docRef: null as any，它会抑制任何相关的错误和警告。

【问题讨论】：

标签： typescript firebase google-cloud-firestore vuejs3

【解决方案1】：

要归档您想要的内容，您必须输入传递给Vue.extend 的选项。例如：

interface VueExtendOptions {
  ...
  data: () => DocumentReference | null
}
const options: VueExtendOptions = {
  ...
  data: function(){
    return {
      docRef: null, //**here
    }
  }
}
export default Vue.extend(options)

可能 Vue 已经完成了这个接口，所以我强烈建议你使用它而不是自己创建。

【讨论】：