CODEWITHSUNDEEP
typescriptfirebasegoogle-cloud-firestorevuejs3
ronbm
ronbm

Reputation: 187

Vue Typecript: declaring data with type

How can I achieve the following similar in Vue with Typescript?

DocumentReference docRef = null

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

Writing docRef: null as DocumentReference gives typescript error:

conversion of null to type DocumentReference may be a mistake

I don't want to write docRef: null as any which suppresses any related error and warning.

Upvotes: 0

Views: 39

Answers (1)

Pedro Mutter
Pedro Mutter

Reputation: 1224

To archive what you want, you must make the options passed to Vue.extend typed. For example:

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

Probably Vue has this interface done already, so I strongly recommend you to use it instead of creating your own.

Upvotes: 1

Related Questions