Getter named as "loading" not acceptable

[Pacheco95]

I got myself losing tons of hours trying to track a bug in my app to discover that nuxt-property-decorator does not accept a getter named "loading".

<template>
  <div>{{ loading }}</div>
</template>

<script lang="ts">
import { Component, Vue } from 'nuxt-property-decorator'

@Component
export default class Playground extends Vue {
  get loading() {
    return 'loading...'
  }
}
</script>

[Vue warn]: Property or method "loading" is not defined on the instance but referenced during render. Make sure that this property is reactive, either in the data option, or for class-based components, by initializing the property. See: https://vuejs.org/v2/guide/reactivity.html#Declaring-Reactive-Properties.

Steps to reproduce

• yarn create nuxt-app my-nuxt-ts-app leave default to all options except javascript/typescript part (select typescript)
• yarn add nuxt-property-decorator
• on pages/index.vue:6 replace to {{ loading }}
• replace Vue.extend to a class component as above
• yarn dev

Sandbox https://codesandbox.io/s/nuxt-property-decorator-loading-bug-orv7l?file=/pages/index.vue

[aapelismith]

Yes, I also encountered the same problem, when the getter is named loading, there will be an error ERROR [Vue warn]: Property or method "loading" is not defined on the instance but referenced during render. Make sure that this property is reactive, either in the data option, or for class-based components, by initializing the property. See : https://vuejs.org/v2/guide/reactivity.html#Declaring-Reactive-Properties.

[aapelismith]

@Pacheco95 hi man Did you solve this problem?

[aapelismith]

I know why, maybe because loading is also one of the hooks, https://github.com/nuxt-community/nuxt-property-decorator/blob/2ea44f733a7a204afaa1cfd96e5eefd1c57699d3/src/nuxt-property-decorator.ts#L17

[aapelismith]

You have to change your variable name to avoid this problem

[aapelismith]

Document address https://www.nuxtjs.org/docs/2.x/configuration-glossary/configuration-loading/

@Pacheco95

[Pacheco95]

I dont think this problem was caused by progress bar configuration because it is setted up in nuxt.config.ts, not in the component definition