Vue Typescript：使用类型声明数据

Question

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

DocumentReference docRef = null

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

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

conversion of null to type DocumentReference may be a mistake

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

Answer 1

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

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

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

Vue Typescript：使用类型声明数据

Vue Typecript: declaring data with type

typescript

firebase

google-cloud-firestore

vuejs3